127.0.0.1 - Beta

But you can call me localhost

 

Links markeren met CSS

· Coding and stuff

Met kun je bepaalde typen links markeren. Bijvoorbeeld een PDF icoon bij een PDF link of een pijltje bij een externe link.

Let wel, de onderstaande CSS werkt goed, maar vanzelfsprekend niet in elke browser. Gebruikers van moderne en IE7 kunnen de extra's zien. Gebruikers van IE6 zien er niets van.

Een externe link herkennen

/* Zoek alle links op en markeer */
a[href^="http:"] {
background: transparent url('aoutside.gif') 100% 50% no-repeat;
padding-right: 10px;
}
/* Sluit het eigen domein uit */
a[href^="http://rw-l.nl"],
a[href^="http://rw-l.nl/blog"],
a[href^="http://www.rw-l.nl"],
a[href^="http://www.rw-l.nl/blog"] {
background: inherit;
padding-right: 0px;
}

Een mailto link herkennen

a[href^="mailto:"] {
background: transparent url(email.png) 100% 50% no-repeat;
padding-right: 10px;
}

Een PDF link herkennen

a[href $='.pdf'] { 
background: transparent url(pdf.png) 100% 50% no-repeat;
padding-right: 10px;
}

Nuttige bronnen

Reageer

Reageren? Stuur een trackback (Zet Javascript aan om een Trackback URL te genereren ) of gebruik onderstaand formulier.

(optioneel veld)
(optioneel veld)

Om spammers buiten de deur te houden is het nodig dat je deze vraag beantwoord.
Persoonlijke info onthouden?
Kattebel
Verberg e-mail
Kleine lettertjes: Alle HTML-tags behalve <b> en <i> zullen uit je reactie worden verwijderd. Je maakt links door gewoon een URL of e-mailadres in te typen.