: odkaz - Triky CSS

Anonim

:linkVolič je pseudo-třída, která se týká všech unvisited kotva ( ) prvky na stránce.

a:link ( color: aquamarine; )

Výše uvedený příklad změní barvu všech nenavštívených odkazů na akvamarín.

Při použití v kombinaci s :hoverpseudotřídou :linkmusí být nejprve zobrazeny, jinak nemusí být definovány vůbec, aby :hoverstyly fungovaly. Je to proto, že jsou stejně specifické, takže pokud :linkpřijdou později, tyto styly by přepsaly styly přechodu.

:linkPseudo-class se zaměří na všechny elementy, které mají hrefatribut, a to i v případě, že hrefmá prázdnou hodnotu. V tomto smyslu je to jako selektor atributů (href).

To znamená, že následující tři prvky HTML je možné stylovat pomocí :linkpseudotřídy:

CSS-Tricks CSS-Tricks CSS-Tricks

Třetí příklad ve výše uvedeném bloku kódu by však byl neplatný HTML.

Existují pouze tři prvky HTML, které přijímají na hrefatribut: , a . Pouze prvek lze stylizovat pomocí :linkpseudotřídy.

hrefAtribut také nemůžete přidat k jinému typu prvku a zajistit jeho stylovost pomocí :link. Jinými slovy, pokud jste měli následující HTML:

 CSS-Tricks 

Následující CSS by nemělo žádný účinek:

div:link ( color: aquamarine; )

HTML by opět selhalo při ověřování, protože hrefnení platným atributem pro .

Vzhledem k tomu, že :linklze cílit pouze na prvky, :linklze styly v CSS definovat bez selektoru typů prvků, například takto:

:link ( color: aquamarine; )

Pro všechny praktické účely při používání HTML je :linkpseudotřída poněkud irelevantní, protože stejného efektu lze dosáhnout pouhým přímým cílením na všechny prvky:

a ( color: aquamarine; )

Pokud však na stránce existují nějaké prvky, které nemají hrefnastavený atribut (například na starších stránkách, které používaly ), výše uvedený kód by cílil i na tyto prvky a nemusí to být požadovaný výsledek.

Je třeba také zdůraznit, že počínaje CSS2 mohou jiné jazyky dokumentů (kromě HTML) definovat další prvky, kromě kotev, které lze stylizovat pomocí :linkpseudotřídy.

Podpora prohlížeče

Chrome Safari Firefox Opera TJ Android iOS
Žádný Žádný Žádný Žádný Žádný Žádný Žádný