: länk - CSS-tricks

Anonim

Den :linkväljaren är en pseudo-klass som riktar alla obesökta ankare ( ) element på en sida.

a:link ( color: aquamarine; )

Exemplet ovan kommer att ändra färgen på alla oviserade länkar till akvamarin.

När den används i kombination med :hoverpseudoklassen :linkmåste den visas först eller annars inte definieras alls för att :hoverstilarna ska fungera. Detta beror på att de är lika specifika, så om de :linkkom efter skulle dessa stilar åsidosätta svävarstilarna.

Den :linkpseudo-klassen kommer att rikta alla element som har en hrefegenskap, även om hrefhar ett tomt värde. Så i den meningen är det som attributväljaren (href).

Detta betyder att följande tre HTML-element alla kan utformas via :linkpseudoklassen:

CSS-Tricks CSS-Tricks CSS-Tricks

Det tredje exemplet i ovanstående kodblock skulle dock vara ogiltig HTML.

Det finns bara tre HTML-element som accepterar hrefattribut: , och . Endast elementet kan utformas via :linkpseudoklassen.

Du kan inte lägga till hrefattributet till en annan typ av element och göra det stilartat via :link. Med andra ord, om du hade följande HTML:

 CSS-Tricks 

Följande CSS skulle inte ha någon effekt:

div:link ( color: aquamarine; )

Återigen skulle HTML misslyckas med validering, eftersom det hrefinte är ett giltigt attribut för .

På grund av det faktum att endast :linkkan rikta in sig på element kan :linkstilar definieras i CSS utan elementtypsväljaren, så här:

:link ( color: aquamarine; )

För alla praktiska ändamål när du använder HTML är :linkpseudoklassen något irrelevant eftersom samma effekt kan uppnås genom att helt enkelt rikta in sig på alla element direkt:

a ( color: aquamarine; )

Men om det finns några element på sidan som inte har hrefattributuppsättningen (till exempel på äldre sidor som används ), kommer ovanstående kod också att rikta in sig på dessa element, och detta kanske inte är det önskade resultatet.

Det bör också påpekas att från och med CSS2 kan andra dokumentspråk (förutom HTML) definiera andra element, förutom ankare, som kan utformas via :linkpseudoklassen.

Webbläsarstöd

Krom Safari Firefox Opera IE Android iOS
Några Några Några Några Några Några Några