Kuinka Ankkuroida HTML

Sisällysluettelo:

Kuinka Ankkuroida HTML
Kuinka Ankkuroida HTML

Video: Kuinka Ankkuroida HTML

Video: Kuinka Ankkuroida HTML
Video: Как создать слайдер изображений с помощью HTML и CSS | Учебное пособие по слайд-шоу изображений 2024, Marraskuu
Anonim

Sivuston ankkuri on erittäin hyödyllinen, jos haluat, että sivustosi artikkeleissa on kätevä siirtyminen luettelokohteiden välillä. He kääntävät sivun haluttuun kohtaan tai avaavat halutun sivun, mikä auttaa käyttäjää löytämään nopeasti tarvitsemansa tiedot.

Kuinka ankkuroida HTML
Kuinka ankkuroida HTML

Jos kirjoitat omaa sivustoasi, sinun olisi pitänyt miettiä, miten sivustosi navigointi olisi helpompaa. Jotta käyttäjän ei tarvitse etsiä tarvitsemiaan tietoja sivustosi kaikilta sivuilta, on parasta käyttää "ankkuri" -tekniikkaa. Se luo linkin mihin tahansa tietoon tai asiakirjaan missä tahansa sivustollasi.

Teoria

Ankkurin luomiseen tarvitaan kaksi elementtiä:

  • Koodin osa, joka osoittaa linkin ankkurillemme, jätettiin sivuston toiseen osaan.
  • Mikä tahansa osa koodista, johon voidaan määrittää tunniste, on ankkurimme.

Ensin sinun on luotava ankkurin ensimmäinen osa - linkki siihen. Ankkurilinkillä on kaksi osaa: sivulinkki ja ankkurilinkki.

  1. Luo "a" -tunniste tai mikä tahansa muu tunniste, joka tukee "href" -attribuuttia
  2. Luo tähän tagiin "href" -attribuutti
  3. Määritä arvon linkki sivustosivulle.
  4. Linkin jälkeen ilmoita linkki ankkuriin käyttämällä symbolia "#" ja mitä tahansa ankkurin nimeä (kirjoitettu yhdessä, esimerkiksi: "#anchor")

Jos ohitat kohdan 3 etkä määritä linkkiä sivustosivulle, ankkuria haetaan nykyiseltä sivulta. Toisin sanoen, jos haluat luoda linkin ankkurille, joka sijaitsee samalla sivulla, voit jättää linkin sivulle itselleen.

Ankkurin toisen osan - tunnuksen - luominen on jäljellä. Se viittaa mihin tahansa sivustokoodin tagiin, joka tukee id-määritettä. Ankkurin luominen edellyttää:

  1. Luo "id" -attribuutti vaadittavaan tagiin.
  2. Määritä "id" -määritteessä edellisessä vaiheessa määritetyn ankkurin nimen arvo. (esimerkki:)

Näiden kahden vaiheen jälkeen sivustolle ilmestyy linkki, joka vie sinut määritettyyn ankkuriin.

Harjoitella

Harkitaan, miten ankkuri luodaan tietyn esimerkin avulla.

Meillä on yksinkertainen sivu, kuten tämä:

Kuva
Kuva

Sivun ylä- ja alaosassa on tekstiä, paljon "br" -tunnisteita, jotka luovat tilaa tekstien välille. Meidän on luotava ankkuri, jotta voimme nopeasti tarkastella tekstiä alareunassa.

Voit tehdä tämän luomalla uuden tunnisteen - "a" tekstin "yläosassa" jälkeen. Siinä luomme "href" -attribuutin. Ankkurin helpottamiseksi kirjoitamme "alas" linkkiin.

Kuva
Kuva

Nyt määritämme attribuutin arvon "#yakor" - tämä on linkki ankkurin nimeen.

Kuva
Kuva

Ankkurin ensimmäinen osa - linkki siihen - on valmis. Nyt jäljellä on vain luoda itse ankkuri. Siirrymme sivun haluttuun osaan. Tässä tapauksessa se on "teksti alareunassa". Koska tämä on yksinkertainen teksti ilman tagia, meidän on luotava se. Tätä varten liitä teksti "kappale" - tagiin "p".

Tässä tagissa luomme "id" -määritteen ja syötämme siihen arvon "yakor". Arvo "yakor" vastaa linkissä määritettyä ankkurin nimeä.

Kuva
Kuva

Nyt ankkurimme toimii kuten pitäisi.

Suositeltava: