Hogyan készítsünk HTML-hivatkozásokat a címkék HREF-attribútumának használatával

A weboldal a weboldalak gyűjteménye. Ezeket az oldalakat össze kell kapcsolni vagy össze kell kapcsolni valamivel. Ehhez pedig egy HTML által biztosított címkét kell használnunk: a atag-et.

Ez a címke meghatároz egy hiperhivatkozást, amelyet az egyik oldalról a másikra történő hivatkozásra használnak. Az aelem legfontosabb attribútuma pedig az hrefattribútum, amely jelzi a hivatkozás célját.

Ebben az útmutatóban megmutatom, hogyan lehet HTML-hivatkozásokat létrehozni hrefa acímkén található attribútum használatával .

  • Mi a link?
  • Hogyan hozhatunk létre belső linkeket
  • Tallózás az azonos szintű oldalakra
  • Tallózás egy másik mappában található oldalakra
  • Tallózás a mappában található oldalról a gyökérig
  • Hogyan lehet külső linkeket létrehozni
  • Horgony linkek létrehozása
  • Navigáljon ugyanazon az oldalon
  • Navigáljon egy másik oldalon
  • Következtetés

Mi a link?

A hivatkozás kattintható szöveg, amely lehetővé teszi az egyik oldalról a másikra, vagy ugyanazon oldal egy másik részébe való böngészést.

A webfejlesztésben többféle módon lehet linkeket létrehozni, de a leggyakoribb a acímke és az hrefattribútum használata. Ez utóbbi az, ahol megadjuk a link célcímét.

A acímke segít a linkek három fő típusának létrehozásában: egy belső, egy külső és egy horgony linkben. Ennek ellenére most elmélyülhetünk a belső szakasz létrehozásának módjában a következő szakaszban.

Hogyan hozhatunk létre belső linkeket

Webhely felépítésénél van értelme összekapcsolni az oldalakat. Amíg ezek a linkek lehetővé teszik számunkra, hogy az A oldalról a B oldalra navigáljunk, belső linknek hívjuk (mivel mindig ugyanazon a domain néven vagy ugyanazon a webhelyen találhatók). Tehát a belső link egy olyan link, amely lehetővé teszi a weboldal egy másik oldalára való navigálást.

Most, tekintve, hogy a mappánk a következőképpen épül fel:

├── folder1 | └── page2.html ├── page1.html ├── index.html 

Itt három felhasználási esetünk van, és mindegyikhez létrehozunk egy példát.

Tallózás az azonos szintű oldalakra

  • index.html
Browse to Page 1 

Mint látható, az oldal page1.htmlugyanazon a szinten van, ezért az hrefattribútum útvonala csak az oldal neve.

Tallózás egy másik mappában található oldalakra

  • page1.html
Browse to Page 2 

Itt más a felhasználási esetünk, mivel a meglátogatni kívánt oldal most nem ugyanazon a szinten van. És ahhoz, hogy el tudjunk navigálni arra az oldalra, meg kell adnunk a fájl teljes elérési útját, beleértve a mappát is.

Nagy! Merüljünk most bele az utolsó használati esetbe.

Tallózás a mappában található oldalról a gyökérig

  • page2.html
Browse to the Home Page 

Itt, az index.htmloldalra való navigáláshoz először egy szinttel feljebb kell lépnünk, mielőtt böngészhetnénk az adott oldalra.

A belső linkekre már kitértünk, ezért lépjünk tovább, és mutassuk be, hogyan lehet navigálni a külső linkekre.

Hogyan lehet külső linkeket létrehozni

Mindig hasznos, ha külső webhelyekre is el lehet navigálni.

Browse to Google 

Amint itt láthatja, a Google-hoz való navigáláshoz meg kell adnunk annak URL-jét az hrefattribútumhoz.

Külső és belső linkeket használunk az A oldalról a B oldalra történő navigáláshoz. Néha azonban ugyanazon az oldalon akarunk maradni, és egy adott részhez kell navigálni. Ehhez egy horgony linket kell használnunk, merüljünk bele a következő szakaszban.

Horgony linkek létrehozása

A horgony link egy kicsit konkrétabb: lehetővé teszi számunkra, hogy az A pontról a B pontra navigáljunk, miközben ugyanazon az oldalon maradunk. Használható arra is, hogy egy másik oldalon lévő részhez menjen.

Navigáljon ugyanazon az oldalon

Go to the anchor 

A többiekhez képest ez egy kicsit más. Valóban, de még mindig ugyanúgy működik.

Itt az oldalhivatkozás helyett hivatkozunk egy elemre. Amikor rákattintunk a linkre, azonos nevű elemet fog keresni hashtag ( about) nélkül . Ha megtalálja azt az azonosítót, akkor arra a részre böngész.

Navigáljon egy másik oldalon

Go to the anchor 

Ez nagyjából megegyezik az előző példával, azzal a különbséggel, hogy meg kell határoznunk azt az oldalt, amelyben böngészni akarunk, és hozzá kell adni a horgonyt.

Következtetés

Ez hrefa acímke legfontosabb attribútuma . Ez lehetővé teszi számunkra, hogy az oldalak között, vagy csak egy adott rész között navigáljunk. Remélhetőleg ez az útmutató segít rengeteg linket tartalmazó webhely felépítésében.

Köszönöm, hogy elolvasta.

Nyugodtan forduljon hozzám!

TWITTER BLOG HÍRLEVÉL GITHUB LINKEDIN CODEPEN DEV

Fotó: JJ Ying az Unsplash-on