A hrefjes met class

[raymond88]

Ik kom er even niet uit. Ik heb een div met een klasse, met daarin een enkele links. Die a hrefjes geef ik verschillende klasses mee, hoe kan ik deze dan benaderen? Dus;

<div class="divje">
<a href="fsda" class="link">das</a>
<a href="sadgsd" class="link_geselecteerd">dsaf</a>
</div>

 

[csshunter]

Hoi raymond88,
Als het er om gaat om van een rijtje links er alleen één uit te halen die iets afwijkends heeft, kan het zelfs zonder een class voor de gewone links.
De html wordt dan als volgt:

<div class="divje">
   <a href="abcd.htm">abcd</a> |
   <a href="efgh.htm">efgh</a> |
   <a class="geselecteerd" href="ijkl.htm">ijkl</a> |
   <a href="mnop.htm">mnop</a>
</div>

In de css wordt het dan bijvoorbeeld:

.divje a {
   color: green;
   }
.divje a.geselecteerd {
   color: red;
   }

Nu worden alle links in het divje groen, behalve de gelecteerde, die rood wordt.
Dit werkt zo, omdat alle links in het divje volgens opdracht weliswaar groen moeten worden, maar omdat de "geselecteerd" genoemde link een eigen class heeft, is deze specifieker dan de andere links.
En bij CSS krijgt altijd het meest specifieke element de voorrang.

De C van CSS is de C van Cascade (waterval), en wie onderaan de waterval staat krijgt altijd alles over zich heen wat er van boven komt. Behalve als je een eigen parapluutje hebt, dan blijf je droog.

Net zoals iedereen die recht onder je staat (d.w.z. de kind-elementen van iets). Er zijn wel wat uitzonderingen op deze algemene regel, maar dat is in het echt ook zo: als het flink waait, blijven degenen die onder je staan zeker niet droog. :d.

Met vriendelijke groet,
CSShunter

 

[raymond88]

Haha, heel erg duidelijke en nuttig verhaal. Natuurlijk ook nog met een stukje verhaal achter CSS, toppie :thumb:

Dit heeft mijn probleempie goed op kunnen lossen. Bedankt.