Sisältö

• Astua
• Tapa 1/2: Kirjoita HTML-koodi
• Tapa 2/2: Ymmärrä HTML-koodi

Yhdellä HTML-koodirivillä voit lisätä napsautettavan kuvan melkein mille tahansa verkkosivustolle. Tarvitset kaksi asiaa, jotta tämä toimii. Tarvitset kuvan URL-osoitteen ja myös verkkosivuston URL-osoitteen.

Astua

Tapa 1/2: Kirjoita HTML-koodi

1. Luo HTML-tiedosto. Avaa tekstieditori ja luo sitten uusi tiedosto. Tallenna tiedosto index.html-tiedostona.
   • Voit käyttää mitä tahansa haluamaasi tekstieditoria, jopa Windowsin (Muistio) ja Mac OS X: n (TextEdit) yksinkertaisia ​​tekstieditoria.
   • Jos haluat käyttää HTML: n kanssa työskentelyyn tarkoitettua tekstieditoria, napsauta tätä ladataksesi Atom, tekstieditori Windowsille, Mac OS X: lle ja Linuxille.
   • Jos käytät TextEdit-tiedostoa, napsauta Muoto-valikkoa ennen HTML-tiedoston luomista ja napsauta sitten Tee tavalliseksi tekstiksi. Tämä asetus varmistaa, että HTML-tiedosto latautuu oikein verkkoselaimeen.
   • Microsoft Wordin kaltaiset tekstinkäsittelyohjelmat eivät ole kovin hyviä HTML-koodien kirjoittamiseen, koska ne lisäävät näkymättömiä merkkejä ja muotoiluja, jotka voivat vahingoittaa HTML-tiedostoa ja näyttää sen väärin verkkoselaimessa.
2. Kopioi ja liitä tavallinen HTML-koodi. Valitse ja kopioi alla oleva HTML-koodi ja liitä se avattuun index.html-tiedostoon.
   

   a href = "kohde-URL"> img src = "kuva-URL" /> / a>

3. Etsi kuvasi URL-osoite. Etsi kuva verkosta, napsauta sitä hiiren kakkospainikkeella ja napsauta (selaimestasi riippuen) Kopioi kuvan URL-osoite, Kopioi kuvan osoite tai Kopioi kuvan sijainti.
   • Firefox ja Internet Explorer käyttävät Kopioi kuvan sijainti. Chrome käyttää Kopioi kuvan URL-osoitetta. Safari käyttää Kopioi kuvaosoitetta.
4. Lisää kuvan URL-osoite. Napsauta ja vedä index.html-tiedostossa hiirellä kuvan URL-osoitetta ja liitä se painamalla CTRL + V.
5. Lisää kohde-URL. Poista index.html-tiedostosta kohde-URL ja kirjoita https://www.startpage.com.
   • Voit käyttää mitä tahansa URL-osoitetta kohde-URL-osoitteena.
6. Tallenna HTML-tiedosto.
7. Avaa HTML-tiedosto verkkoselaimessa. Napsauta hiiren kakkospainikkeella index.html ja avaa tämä tiedosto valitsemassasi selaimessa.
   • Jos selain avautuu, mutta kuvaa ei näy, varmista, että kuvatiedoston nimi on kirjoitettu oikein index.html-tiedostossa.
   • Kun selain avautuu, mutta taustakuvan sijaan näkyy HTML-koodi, index.html tallennetaan .rtf-tiedostona (rikkaat tekstitiedosto). Yritä muokata HTML-tiedostoa toisessa tekstieditorissa.

Tapa 2/2: Ymmärrä HTML-koodi

1. Ymmärrä ankkuritunniste. HTML-koodi koostuu avaus- ja sulkemistunnisteista. A href = ""> -tunniste on aloitustagi ja / a> on lopputunniste. Tätä kutsutaan ankkuritunnisteeksi ja sitä käytetään linkkien lisäämiseen verkkosivulle.
   • a käskee selainta luomaan linkin. href on lyhenne HTML-viitteestä, = käskee selainta vaihtamaan kaiken välillä ’ ’ luo linkki. Mikä tahansa URL-osoite voidaan sijoittaa kahden lainausmerkin väliin.
   • / a> kertoo selaimelle, että ankkuritunniste on suljettu.
   • Kun lisäät tekstiä väliin a href = ""> ja / a> että tekstistä tulee napsautettava linkki verkkosivulla. Esimerkiksi: a href = "https://www.google.com"> Google / a> luo linkin Googleen.
2. Ymmärrä kuvalappu. Img> -tunniste on suljettu tunniste. Voit sulkea sen valitsemalla img src = "" /> tai img src = ""> / img>.
   • img tag käskee selainta näyttämään kuvan. src on lyhenne lähteestä, de = käskee selainta poistamaan kaiken ’ ’ ja noudata kuvaa kyseisestä sijainnista.
   • /> käskee selainta sulkemaan kuvatunnisteen.
   • Esimerkiksi: {samp [} saa kuvan kyseisestä URL-osoitteesta ja näyttää sen sitten verkkoselaimessa.
3. Käytä tätä koodia kaikkialla. Nyt kun tiedät tämän koodin, voit a href = "kohde-URL"> img src = "kuva-URL" /> / a> napsautettavien kuvien lisäämiseksi mille tahansa verkkosivulle HTML-koodilla.