CSS

Links kennzeichnen

(msc) Mit dem erwähnten content-Pseudo-Element lassen sich aber Links oder andere Elemente besonders kennzeichnen – und das klappt mit Firefox.

Der Trick dabei ist, in einer CSS-Regel alle Links (alle HTML-Tags a) zu selektieren. Sollen nur externe Links markiert werden, lässt sich das über eine Einschränkung beim Selektor realisieren: Indem hier [href^="http://"] eingefügt wird, bezieht sich die Definition nur auf externe Links, die mit «http» eingeleitet werden.

Dann geben wir über die Pseudoklasse before an, dass wir den Text vornedran anhängen wollen und definieren dann über content den einzufügenden Text: Das ist ein Pfeil (das Unicode-Zeichen Nummer 2197) und ein geschütztes Leerzeichen, das wir an dieser Stelle über das Unicode-Zeichen 00A0 einfügen. Die ganze CSS-Klausel sieht dann so aus:

a[href^="http://"]:before {content: "2197?0A0";}

Und so wird das auf der Webseite dargestellt (ohne dass man hier an den Links selbst etwas ändern müsste):

Quelle: Publisher, Mittwoch, 13. Februar 2008

Rubrik und Tags:

Faksimile

Metadaten
Thema: Webtipps
Nr: 8176
Ausgabe: 08-1
Anzahl Subthemen: 8

Obsolete Datenfelder
Bilder: 0
Textlänge: 63
Ort:
Tabb: FALSCH