: връзка - CSS-трикове

Anonim

В :linkселектора е псевдо-класа, която е насочена цялата непосещавани котва ( ) елементи на страницата.

a:link ( color: aquamarine; )

Примерът по-горе ще промени цвета на всички непосетени връзки към аквамарин.

Когато се използва в комбинация с :hoverпсевдокласа, :linkтрябва да се появи първо или да не се дефинира изобщо, за да могат :hoverстиловете да работят. Това е така, защото те са еднакво специфични, така че ако :linkдойдат след това, тези стилове ще заменят стиловете на задържане.

В :linkпсевдо-класа ще бъде насочена към всички елементи, които имат hrefатрибут, дори и ако hrefе празна стойност. Така че в този смисъл е като селектора на атрибути (href).

Това означава, че следните три HTML елемента могат да бъдат стилизирани чрез :linkпсевдокласа:

CSS-Tricks CSS-Tricks CSS-Tricks

Третият пример в горния кодов блок обаче би бил невалиден HTML.

Има само три HTML елементи, които приемат hrefатрибут: , , и . Само елементът може да бъде стилизиран чрез :linkпсевдокласа.

Също така не можете да добавите hrefатрибута към друг тип елемент и да го направите стилен чрез :link. С други думи, ако сте имали следния HTML:

 CSS-Tricks 

Следният CSS няма да има ефект:

div:link ( color: aquamarine; )

Отново, HTML няма да успее при проверката, тъй като hrefне е валиден атрибут за .

Поради факта, че :linkмогат да се насочват само към елементи, :linkстиловете могат да бъдат дефинирани в CSS без селектор за тип елементи, като този:

:link ( color: aquamarine; )

Също така, за всички практически цели при използване на HTML, :linkпсевдокласът е донякъде без значение, тъй като същият ефект може да бъде постигнат чрез просто насочване директно към всички елементи:

a ( color: aquamarine; )

Ако обаче на страницата има елементи, които нямат hrefзададен атрибут (например на стари страници, които са използвали ), горният код би насочил и тези елементи и това може да не е желаният резултат.

Трябва също да се отбележи, че като се започне с CSS2, други езици на документи (освен HTML) могат да дефинират и други елементи, освен анкери, които могат да бъдат стилизирани чрез :linkпсевдокласа.

Поддръжка на браузър

Chrome Сафари Firefox Опера IE Android iOS
Всякакви Всякакви Всякакви Всякакви Всякакви Всякакви Всякакви