Heim >Web-Frontend >HTML-Tutorial >Legen Sie die Schriftfarbe von Hyperlinks und die Schriftfarbe nach dem Klicken durch HTML fest

Legen Sie die Schriftfarbe von Hyperlinks und die Schriftfarbe nach dem Klicken durch HTML fest

不言
不言Original
2018-06-12 11:39:522838Durchsuche

Dieser Artikel befasst sich hauptsächlich mit dem Festlegen der Schriftfarbe von Hyperlinks und der Schriftfarbe nach dem Klicken in HTML. Jetzt kann ich ihn mit Ihnen teilen

CSS bereitet für einige Spezialeffekte spezielle Tools 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, ausführlich vorgestellt.

Linkstile definieren
CSS hat spezielle Tools für einige Spezialeffekte vorbereitet ., wir nennen es „Pseudoklasse“. 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:

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, der Link ist schwarz, wenn die Maus darüber fährt, und der Link ist weiß, wenn darauf geklickt wird.
Wenn der normale Link den gleichen Stil wie der besuchte Link hat und der Stil beim Bewegen und Klicken mit der Maus derselbe ist, können sie auch kombiniert werden, um Folgendes zu definieren:

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, obwohl die Linkdefinition geschrieben wurde, gibt es auch Regeln. Wenn die Schreibreihenfolge dieser vier Elemente leicht falsch ist, kann die Wirkung des Links verloren gehen. Bestätigen Sie daher unbedingt die Reihenfolge jedes Mal, wenn Sie einen Linkstil definieren, link-- besuchte --hover-aktiv, was wir oft als LoVe HAte-Prinzip bezeichnen (die Groß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:

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

Aufrufmethode:
8bd8f5f601bef3de2be1c11f4668a4f035cb5678f7e57eb950d260e7457f0e9094b3e26ee717c64999d7867364b1b4a3 Die Definitionsmethode von class ist die gleiche wie id. Ändern Sie einfach #sidebar in .sidebar. Eine andere Methode besteht darin, den Linkstil direkt zu definieren. Der Aufruf ist jedoch umständlicher, da Sie jedem einzelnen Link definierten Code hinzufügen müssen.
Beispiel:

 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:

e388a4556c0f65e1904146cc1a846beeabacc1b54f317844137ec285f20b3901 Link zu Script House 13499910bf9dac5ae3c52d5ede738348594b3e26ee717c64999d7867364b1b4a3
Die Definition des Links besteht hauptsächlich aus drei Attributen: Farbe (color), Textdekoration (text-decoration) und Hintergrund (background)

und Oben Das ist der gesamte Inhalt dieses Artikels. Ich hoffe, er wird für das Studium aller hilfreich sein. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website.

Verwandte Empfehlungen:

CSS Einführung in die Verwendung des Solid-Attributs von Border

css Erläuterung des Hintergrunds:transparent

Die Rolle von Meta in der HTML-Seite und die Analyse der Cache- und Nicht-Caching-Einstellungen der Seite

Das obige ist der detaillierte Inhalt vonLegen Sie die Schriftfarbe von Hyperlinks und die Schriftfarbe nach dem Klicken durch HTML 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