Odkazy jsou skvělý způsob,
jak propojit jednu webovou
stránku s druhou.
Ale mohou i propojovat
jednu část stránky
s jinou částí té samé stránky.
To se hodí například když chceme vytvořit
obsah u velmi dlouhých stránek.
Teď jsem přidala
pár informací i na tuto stránku,
abych vám mohla předat trochu
historie o webu a historii verzí HTML.
Už toho tady mám docela hodně,
takže by se mi hodil obsah stránky.
Tady nahoře už jsem začala.
je to prostě nečíslovaný seznam položek
obsahující nadpis každé sekce.
A chtěla jsem prolinkovat
odkazy s nadpisy sekcí,
abyste na ně mohli kliknout
a přesunout se do dané části stránky.
Abych to udělala, tak znovu použiji
tag
a začnu tím,
že uzavřu tenhle nadpis
do tagu ''.
A kam by měl atribut 'href' odkazovat?
No nějak musíme říct prohlížeči,
kam má na stránce skočit.
Musíme nějak unikátně určit část stránky.
Jestliže už jste se učili CSS selektory,
tak už vlastně víte,
jak se to dá udělat.
Můžeme toho docílit tak,
že přidáme tagu atribut 'id'.
Pojďme sjet dolů
a najít tam nadpis.
A k tomuto nadpisu přidáme atribut 'id'.
Takže najedu kurzorem do '',
napíšu id rovná se
a vymyslím dobrý, unikátní identifikátor,
například "web-history".
Dobře, pojďme zpět k odkazu.
Teď řekneme prohlížeči,
aby šel na tenhle interní odkaz,
musíme začít křížkem
a napsat stejné id,
které jsme napsali níže.
Tak a teď si zastavte tenhle návod
a zkuste kliknout na odkaz.
Jen běžte, já počkám.
Klik-klik!
Viděli jste, jak to sjelo dolů
do této sekce?
Fungovalo to!
A můžeme přidat ještě víc odkazů
tím, že přidáme id atribut
na každé záhlaví.
a uděláme tagy '',
které na ně odkazují.
Ale to si zkuste sami.
Hlavně si zapamatujte,
že ID musejí být unikátní,
protože jinak prohlížeč
nebude vědět, kam má skočit.
Takže je udělejte hezké a popisné.