Heim > Artikel > Web-Frontend > Die Rolle von a:active in CSS und detaillierte Erklärung seiner Verwendung

Die Rolle von a:active in CSS und detaillierte Erklärung seiner Verwendung

黄舟Original: 2017-07-19 16:53:4816844Durchsuche

CSS: aktiver Selektor

Definition und Verwendung

　: aktiver Selektor wird zur Auswahl aktiver Links verwendet.

Wenn Sie auf einen Link klicken, wird dieser aktiv.

Tipp: Bitte verwenden Sie den :link-Selektor, um Links zu nicht besuchten Seiten zu formatieren, :visited, um Links zu besuchten Seiten zu formatieren, und den :hover-Selektor, um den Mauszeiger so einzustellen, dass er auf dem Link „Letzter Stil“ schwebt.

Beispiel 1 Wählen Sie nicht besuchte, besuchte, schwebende und aktive Links aus und legen Sie deren Stile fest:

a:link{color:blue;}
a:visited{color:blue;}
a:hover{color:red;}
a:active{color:yellow;}

Beispiel 2 Legen Sie verschiedene Stile für Links fest:

a.ex1:hover,a.ex1:active {color:red;}
a.ex2:hover,a.ex2:active {font-size:150%;}

Definieren Sie die Stil des Links, wenn die Maus aktiviert (geklickt) wird. Es gibt vier Link-Pseudoklassen:
a:Link normaler Linkstil a:besuchter Link besuchter Stil a:Hover-Link hervorgehoben (Mouseover) Stil a:aktiver Link aktivierter Stil

Beispiel:

<!DOCTYPE html>
<html>
<head>
<style>
a:active
{
background-color:yellow;
}
</style>
</head>
<body>

<a href="http://www.w3school.com.cn">W3Sschool</a>
<a href="http://www.google.com">Google</a>
<a href="http://www.wikipedia.org">Wikipedia</a>

<p><b>注释：</b>:active 选择器为活动的链接设置样式。</p>

</body>
</html>

Das Ergebnis ist: W3Sschool Google Wikipedia
Kommentare: Der :active-Selektor formatiert aktive Links.
Definieren Sie den Stil des Links, wenn die Maus aktiviert (geklickt) wird. Es gibt vier Link-Pseudoklassen:
a:link normaler Linkstil a:besuchter Link besuchter Stil a:Hover-Link hervorgehoben (Mouseover) Stil a:aktiver Link aktivierter Stil

Das obige ist der detaillierte Inhalt vonDie Rolle von a:active in CSS und detaillierte Erklärung seiner Verwendung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Beispielcode zum Ausrichten von text-align:justify an beiden Enden in CSSNächster Artikel：Beispielcode zum Ausrichten von text-align:justify an beiden Enden in CSS

In Verbindung stehende Artikel

Mehr sehen