So ändern Sie Die Farbe Eines Hyperlinks

Inhaltsverzeichnis:

So ändern Sie Die Farbe Eines Hyperlinks
So ändern Sie Die Farbe Eines Hyperlinks

Video: So ändern Sie Die Farbe Eines Hyperlinks

Video: So ändern Sie Die Farbe Eines Hyperlinks
Video: Microsoft Word 2007 - Hyperlink Farbe ändern / anpassen (Design, Formatvorlagen, Link) 2024, Kann
Anonim

Das Attribut Cascading Style Sheets (CSS) wird am häufigsten verwendet, um die Farbe von Hyperlinks in Webseiten zu ändern. Weniger funktionale Lösungen für dieses Problem gibt es in der HTML-Sprache (HyperText Markup Language - "Hypertext Markup Language").

So ändern Sie die Farbe eines Hyperlinks
So ändern Sie die Farbe eines Hyperlinks

Es ist notwendig

Grundkenntnisse in HTML- und CSS-Sprachen

Anleitung

Schritt 1

Bereiten Sie einen Stilblock für Hyperlinks vor. In seiner einfachsten Form könnte es so aussehen: a {color: Green} Hier wird "a" als "Selektor" bezeichnet, was angibt, dass die Stilbeschreibung in Klammern auf alle Link-Tags im Dokument angewendet werden soll. Grün definiert die Farbe des Links; dies ist eine sehr grobe Definition von Farbe und wird selten verwendet. Viel häufiger wird dem "a"-Selektor eine "Pseudo-Klasse" hinzugefügt - ein Label, mit dem Sie den Stil des Links in drei verschiedenen Zuständen angeben können.

Schritt 2

Verwenden Sie die Link-Pseudoklasse, um den normalen (inaktiven) Zustand des Links zu gestalten. Es kann zum Beispiel so aussehen: a: link {color: Green}

Schritt 3

Verwenden Sie den Hover der Pseudoklasse, um anzugeben, wie der Link beim Hover angezeigt werden soll. Zum Beispiel: a: hover {color: Lime}

Schritt 4

Verwenden Sie die besuchte Pseudoklasse, um den Stil eines bereits besuchten Links zu beschreiben. Zum Beispiel: a: besucht {color: DarkGreen}

Schritt 5

Kombinieren Sie alle drei Zustände in einem Stilbeschreibungsblock. Das Aussehen von HTML-Code, der CSS-Beschreibungen von Stilen enthält, kann beispielsweise so aussehen:

a: Link {Farbe: Grün}

a: besucht {Farbe: Dunkelgrün}

a: schweben {Farbe: Limette}

Hier teilen die öffnenden und schließenden HTML-Style-Tags dem Browser mit, wo die Style-Beschreibungen beginnen und enden, und dazwischen befindet sich eine Beschreibung des Link-Verhaltens in drei Zuständen.

Schritt 6

Das oben verwendete Beispiel zeigt nur die Farbmerkmale, aber andere Attribute können in die Beschreibung aufgenommen werden. Wenn das Seitendesign beispielsweise erfordert, dass der Link im normalen (inaktiven) Zustand nicht unterstrichen wird, sondern unterstrichen wird, wenn der Cursor darüber bewegt wird, kann der Code wie folgt geändert werden:

a: Link {Farbe: Grün; Textdekoration: keine;}

a: besucht {Farbe: Dunkelgrün; Textdekoration: keine;}

a: schweben {Farbe: Limette; Textdekoration: unterstreichen;}

Schritt 7

Wenn Sie nur die Farbe einiger Links auf der Seite ändern und den Rest mit den Standardeinstellungen belassen möchten, fügen Sie das Klassenattribut zum Tag jedes zu ändernden Links hinzu. Benennen Sie diese Hyperlinkklasse beispielsweise newLinks. Dann kann das Link-Tag so aussehen: text link Der Stilbeschreibung muss der gleiche Klassenname hinzugefügt werden:

a.newLinks: link {Farbe: Grün; Textdekoration: keine;}

a.newLinks: besucht {color: DarkGreen; Textdekoration: keine;}

a.newLinks: hover {color: Lime; Textdekoration: unterstreichen;}

Schritt 8

Platzieren Sie den aus den oben beschriebenen Beispielen erstellten Stilbeschreibungscode in der Kopfzeile der Seite - zwischen den und -Tags. Fügen Sie bei Bedarf ein Klassenattribut zu den Link-Tags mit dem in den Stilbeschreibungen verwendeten Namen hinzu. Speichern Sie dann die geänderte Seite und das Verfahren zum Ändern der Farbe der Hyperlinks ist abgeschlossen.

Empfohlen: