Przejdź do treści

Odsyłacze

Do etykiety

Etykieta - inaczej zakładka lub kotwica (ang. anchor) - to pewne zaznaczone miejsce na stronie. Jeśli zdefiniujemy taką zakładkę, będziemy mogli się później do niej bezpośrednio przenosić. Etykiety są wykorzystywane, gdy w jednym dokumencie znajduje się więcej ważnych miejsc - podrozdziałów, a wstawienie ich do osobnych plików, byłoby uciążliwe, ze względu na ich liczbę.

Tak jak w książce - każdy rozdział składa się z mniejszych podrozdziałów - tak samo na każdej osobnej stronie HTML definiuje się zakładki. Dzięki takiej konstrukcji, nawigacja w serwisie staje się dużo łatwiejsza. Po kliknięciu odsyłacza do etykiety, przeglądarka internetowa przenosi użytkownika bezpośrednio do podrozdziału, a nie na początek strony, przez co nie jest on zmuszony do samodzielnego odszukania wybranego tematu (co w przypadku obszernych dokumentów mogłoby długo potrwać). Etykietę można zdefiniować w dowolnym miejscu strony - również wewnątrz zwykłego tekstu.

Jeśli chcemy używać etykietę, najpierw należy ją zdefiniować w wybranym miejscu strony za pomocą polecenia:

<a name="nazwa_etykiety"></a>

Następnie możemy się do niej odwoływać, zarówno z tej samej jak i z innej strony, za pomocą zwykłych odsyłaczy:

<a href="(ścieżka do strony)#nazwa_etykiety">opis odsyłacza</a>

Istnieją dwa rodzaje odsyłaczy do etykiet:

  1. Etykieta zdefiniowana na tej samej stronie
    <a href="#nazwa_etykiety">opis odsyłacza</a>
    (...)
    <a name="nazwa_etykiety">(opis etykiety)</a>
    lub
    <a name="nazwa_etykiety">(opis etykiety)</a>
    (...)
    <a href="#nazwa_etykiety">opis odsyłacza</a>
  2. Etykieta zdefiniowana na innej stronie
    <a href="ścieżka dostępu lub adres internetowy#nazwa_etykiety">opis odsyłacza</a>

    UWAGA! Na podanej stronie musi zostać zdefiniowana etykieta - polecenie:
    <a name="nazwa_etykiety">(opis etykiety)</a>

We wszystkich przypadkach <a name="nazwa_etykiety">...</a> oznacza etykietę, do której nastąpi przeniesienie, po kliknięciu odsyłacza <a href="(ścieżka dostępu)#nazwa_etykiety">...</a>.

Polecenie powoduje przejście do innego miejsca (etykiety) na tej samej lub innej stronie. Zasady wpisywania ścieżki dostępu są takie same jak w przypadku odsyłacza do podstrony. Należy jedynie pamiętać, że nazwa etykiety w poleceniu odsyłacza: <a href="#... oraz w definicji etykiety: <a name="... musi być bezwzględnie taka sama (włączając w to wielkość liter), jedynie w odsyłaczu nazwę należy poprzedzić znakiem # (krzyżyk)!

Można również zauważyć, że kolejność wpisywania odsyłacza <a href="#... oraz etykiety <a name="... na stronie jest dowolna, tzn. etykieta może znajdować się wcześniej niż odsyłacz do niej (powodując np. przeniesienie na samą górę strony). Dodatkowo opis etykiety nie jest konieczny (ale konieczny jest opis odsyłacza, bo w przypadku gdy go nie podamy, odsyłacz nie pojawi się na ekranie).

Na stronach WWW bardzo często umieszcza się etykiety bez opisu (ale należy pamiętać o zamknięciu znacznika). Chociaż zakładka taka nie jest widoczna na ekranie, to znajduje się w kodzie źródłowym strony i można się do niej odnosić.

Etykietę można również utworzyć, stosując atrybut id="identyfikator". Różnica polega na tym, że atrybut ID można użyć w stosunku do prawie wszystkich znaczników (oprócz: BASE, HEAD, HTML, META, SCRIPT, STYLE, TITLE).

UWAGA! Bardzo ważne: w nazwach etykiet lepiej nie używać:
  • wielkich liter
  • znaków, np.: \ / : * ? " < > |
  • spacji (jeśli musisz, w zamian używaj podkreślnika "_")
  • polskich liter (ą, ć, ę, ł, ń... itd.)

Dodatkowo należy bezwzględnie pamiętać, że na tej samej stronie nie mogą się znajdować dwie identyczne etykiety! Można natomiast umieścić takie same etykiety na różnych stronach.

Przykład:

Odsyłacz pierwszego rodzaju (do etykiety "#do_adresu_internetowego" na tej stronie):
Do adresu internetowego

Odsyłacz drugiego rodzaju (do etykiety "#paragraf" na stronie "tekst.html" - spójrz na pasek stanu przeglądarki po wskazaniu odsyłacza myszką):
Paragraf

Zobacz także

Komentarze

Zobacz więcej komentarzy