Ein Link ist eine Verbindung von einer Webseite zu einer anderen, und CSS kann Links durch verschiedene Attribute auf unterschiedliche Weise formatieren.
1. Linkstil
Links sind ein wichtiger Bestandteil einer Website. Sie können auf fast jeder Webseite viele Links sehen. Links haben vier verschiedene Zustände, nämlich Link, Besucht, Aktiv und Hover. Sie können über die folgenden Pseudoklassenselektoren unterschiedliche Stile für die vier Zustände des Links festlegen:
(1) a:link => Dies ist ein normaler, nicht besuchter Link.
(2) a: besuchte => Dies ist ein Link, den der Benutzer mindestens einmal besucht hat
(3) a:hover => wenn die Maus darüber fährt, handelt es sich um einen Link
(4) a: active => Dies ist ein Link, der gerade angeklickt wurde.
Grammatik:
a:link{color:color_name;}Farbname kann ein beliebiges Format haben, beispielsweise ein Farbname (grün), ein Hexadezimalwert (#5570f0) oder ein RGB-Wert – rgb(25, 255, 2). Es gibt einen weiteren Status „a:focus“, der zum Fokussieren verwendet wird, wenn der Benutzer die Tabulatortaste zum Durchsuchen eines Links verwendet.
Standardwert für Link:
(1) Standardmäßig sind erstellte Links unterstrichen.
(2) Wenn Sie mit der Maus über den Link fahren, verwandelt sich dieser in ein Handsymbol.
(3) Normale/unbesuchte Links sind blau.
(4) Besuchte Links sind lila gefärbt.
(5 ) Aktive Links sind rot.
(6) Wenn ein Link fokussiert ist, wird er von einem Umriss umgeben.
Zum Beispiel:
<!DOCTYPEhtml><html><head><metacharset=UTF-8><title>CSSlinks</title><style>p{font-size:25px;text-align:center;}</style></head ><body><p><ahref=https://www.dotcpp.com/>Einfacher Link</a></p></body></html>Die angezeigten Ergebnisse lauten wie folgt:
2. Wie stelle ich den Linkstil mit CSS ein?
Hier sind einige grundlegende CSS-Eigenschaften für Links:
(1) Farbattribut
Diese CSS-Eigenschaft wird verwendet, um die Farbe des Linktextes zu ändern.
Grammatik:
a{color:color_name;}(2) Attribut „font-family“.
Diese Eigenschaft wird verwendet, um die Schriftart des Links mithilfe der Eigenschaft „font-family“ zu ändern.
Grammatik:
a{font-family:familyname;}(3) Textdekorationsattribut
Dieses Attribut wird hauptsächlich zum Entfernen oder Hinzufügen von Unterstreichungen und anderen Änderungen an Links verwendet.
Grammatik:
a{text-decoration:none;}Beispiel:
<style>/*Stellen Sie die Schriftgröße ein, um die Sichtbarkeit zu verbessern*/p{font-size:2rem;}/*Entfernen Sie Unterstreichungen mithilfe des Textdekorationsattributs*/a{text-decoration:none;}/*Sie können auch verwenden Fügen Sie für die folgenden Stile die Unterstreichung text-decoration:underline;*/</style> hinzu(4) Hintergrundfarbenattribut
Mit dieser Eigenschaft wird die Hintergrundfarbe des Links festgelegt.
Grammatik:
a{Hintergrundfarbe:Farbname;}