Heim  >  Artikel  >  Web-Frontend  >  HTML legt die Schriftfarbe des Hyperlinks und die Schriftfarbe nach dem Klicken fest

HTML legt die Schriftfarbe des Hyperlinks und die Schriftfarbe nach dem Klicken fest

巴扎黑
巴扎黑Original
2017-06-03 13:53:578038Durchsuche

CSS bereitet spezielle Werkzeuge für einige Spezialeffekte vor, die wir „Pseudoklassen“ nennen. Es gibt mehrere davon, die wir häufig verwenden. Im Folgenden werden die vier Pseudoklassen, die häufig zum Definieren von Linkstilen verwendet werden, im Detail vorgestellt. Link-Stile definieren
CSS bietet spezielle Werkzeuge für einige Spezialeffekte, die wir „Pseudoklassen“ nennen. Es gibt mehrere davon, die wir häufig verwenden. Nachfolgend stellen wir die vier Pseudoklassen vor, die häufig zum Definieren von Linkstilen verwendet werden:
:link
:visited
:hover
:active
Da wir den Link-Stil definieren möchten, ist das Anker-Tag im Hyperlink eine wesentliche Methode zum Schreiben des Anker-Tags und des Pseudo-Klassen-Links ist wie folgt geschrieben:
a:link, definiert den Stil eines normalen Links;
a:visited, definiert den Stil eines besuchten Links;
a:hover, definiert den Stil, wenn die Maus darüber schwebt über den Link;
a:active, definiert den Stil, wenn die Maus auf den Link klickt.
Beispiel:
Der Code lautet wie folgt:

a:link { 
color:#FF0000; 
text-decoration:underline; 
} 
a:visited { 
color:#00FF00; 
text-decoration:none; 
} 
a:hover { 
color:#000000; 
text-decoration:none; 
} 
a:active { 
color:#FFFFFF; 
text-decoration:none; 
}

Die im obigen Beispiel definierte Linkfarbe ist rot, der besuchte Link ist grün, wenn die Maus über den Link fährt, wird er angezeigt ist schwarz und die Farbe, wenn darauf geklickt wird, ist weiß.
Wenn der normale Link und der besuchte Link denselben Stil haben und die Mauszeiger- und Klickstile gleich sind, können sie auch kombiniert und definiert werden:

Der Code lautet wie folgt:

a:link, 
a:visited { 
color:#FF0000; 
text-decoration:underline; 
} 
a:hover, 
a:active { 
color:#000000; 
text-decoration:none; 
}

Die Reihenfolge der Linkdefinitionen
Es gibt keine Regeln ohne Regeln. Obwohl die Linkdefinition geschrieben ist, gibt es auch Regeln. Wenn die Schreibreihenfolge dieser vier Elemente etwas falsch ist, hat dies Auswirkungen Der Link kann verloren gehen, also achten Sie beim erstmaligen Definieren von Linkstilen darauf, die Definitionsreihenfolge Link--besucht--hover-aktiv zu bestätigen, was wir oft als LoVe HAte-Prinzip bezeichnen (das Großbuchstabe). Buchstaben sind ihre Anfangsbuchstaben).
Lokalen Linkstil definieren
Das Schreiben einer Definition wie a:link{} in CSS ändert den Linkstil der gesamten Seite, aber einige lokale Links müssen spezialisiert werden. Dieses Problem ist nicht schwer zu lösen als Link Fügen Sie einfach die angegebene ID oder Klasse vor der Stildefinition hinzu.
Beispiel:

Der Code lautet wie folgt:

#sidebar a:link, 
#sidebar a:visited { 
color:#FF0000; 
text-decoration:none; 
} 
#sidebar a:hover, 
#sidebar a:active { 
color:#000000; 
text-decoration:underline; 
}

Aufrufmethode:
8bd8f5f601bef3de2be1c11f4668a4f0cea3de3d5b189ad57700224569ed7e04Link zur Skript-Startseite3499910bf9dac5ae3c52d5ede738348594b3e26ee717c64999d7867364b1b4a3 Die Definitionsmethode der Klasse ist die gleiche wie id, ändern Sie einfach #sidebar in . Eine andere Methode besteht darin, den Linkstil direkt zu definieren, was direkter ist, aber schwieriger aufzurufen ist und Sie jedem spezifischen Link definierten Code hinzufügen müssen.
Beispiel:
Der Code lautet wie folgt:

 a.redlink a:link, 
a.redlink a:visited { 
color:#FF0000; 
text-decoration:none; 
} 
a.redlink a:hover, 
a.redlink a:active { 
color:#000000; 
text-decoration:underline; 
background:#FFFFFF; 
}
Aufrufmethode:

e388a4556c0f65e1904146cc1a846bee8437831b0cfec3078ae976566a18b189Link to Script House 13499910bf9dac5ae3c52d5ede738348594b3e26ee717c64999d7867364b1b4a3
Die Definition eines Links hat hauptsächlich drei Attribute: Farbe (Farbe), Textdekoration (Text- Dekoration) und Hintergrund

Das obige ist der detaillierte Inhalt vonHTML legt die Schriftfarbe des Hyperlinks und die Schriftfarbe nach dem Klicken fest. 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