Kleuren van links en lijnen onder links

  • Onderwerp starter Onderwerp starter Erat
  • Startdatum Startdatum
Status
Niet open voor verdere reacties.

Erat

Gebruiker
Lid geworden
12 jan 2010
Berichten
45
Ik wil links in diverse kleuren hebben: rood, blauw en groen.
En dan wil ik dat de lijnen onder die links dezelfde kleuren hebben als de links: rood, blauw en groen.
Nu worden alle links onderstreept door één kleur. Die ene kleur kan ik wel aanpassen maar dan geldt dat voor alle links. Is er een manier om per link in te stellen welke kleur het lijntje eronder moet hebben?
 
Ja, dat kan. Het lijntje onder de link krijgt automatisch dezelfde kleur als de tekst in de link.
Dit doe je door de links 'n class te geven, en dan vervolgens met css de kleuren vast te stellen.

HTML:
<a class="rood">rode link</a>
<a class="groen">groene link</a>
<a class="blauw">blauwe link</a>

In je css zet je dan
Code:
a.rood {color: red;}
a.groen {color: green;}
a.blauw {color: blue;}

Alleen: links hebben vaak 'n standaardkleur waar mensen aan zijn gewend (behalve als 't knoppen zijn of zo). In het algemeen is het niet verstandig om die kleuren te veranderen.
 
Dank je wel! :D

Ik heb alleen geen externe css. Ik heb een intern stylesheet. Is het daar ook mee mogelijk?
 
Ja, dat maakt helemaal niets uit. Ik neem aan dat je met 'n intern stylesheet iets in de <head> bedoelt met <style type="text/css">
Dat werkt precies hetzelfde als 'n extern.
Zolang je aan 'n pagina werkt is 'n intern stylesheet vaak het handigst, omdat je dat heel simpel kunt aanpassen. Als je dan klaar bent zou je 't naar 'n extern kunnen veranderen. 't Voordeel is dat 't dan voor alle pagina's kan werken.
Heel simpel.
Je kopieert het hele interne stylesheet naar 'n bestand wat eindigt op .css, dus bijvoorbeeld mijn-geweldige-style.css
't Enige dat je weghaalt is de <style type="text/css"> aan 't begin en </style> aan 't eind.
In je head zet je dan
HTML:
<link rel="stylesheet" type="text/css" href="mijn-geweldige-style.css">
Werkt precies hetzelfde, maar voor élke pagina waaraan je het op deze manier koppelt.
 
Dank je wel voor je uitgebreide antwoord, dat stel ik op prijs. :thumb:

Ik heb alleen dat <style type="text/css"> niet. Ik werk met een oude webeditor. Dit is de code.

<style><!--
h1 { font-family:Century; font-size:12pt; color:rgb(174,87,0); }
h2 { font-family:Century; font-size:12pt; color:rgb(154,117,29); }
p { font-family:Century; color:rgb(0,0,0); }
p.namo-bullet1 { font-family:Century; font-size:12pt; color:rgb(64,0,0); }
p.namo-bullet2 { font-family:Century; font-size:10pt; color:rgb(75,68,41); }
A.type2:link {color:#800000; text-decoration:underline;}
A.type2:visited {color:#800000; text-decoration:underline;}
A.type2:active {color:#800000; text-decoration:underline;}
A.type2:hover {color:#DE903C; text-decoration:underline;}
--></style>

Kan ik dat <style type="text/css"> gewoon erin zetten?
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan