[CSS] Weergave links

[Verwijderd]

Ik heb een aantal divjes, o.a. een navigatiemenu en content.

Nu heb ik een aantal effecten voor de links ingesteld, A:hover etc.
Deze heb ik gebruikt in het menu.

Als ik nu links in het content div zet, dan gaan deze automatisch ook gebruik maken van die hover instellingen. Is er een manier om dit uit te zetten voor een bepaalde div?

[mithras]

Je blokken uniek maken dmv id's en met child elementen of selectors de links aanpakken binnen dat blok.

[Verwijderd]

Verwijderd schreef op maandag 15 oktober 2007 @ 14:47:
Ik heb een aantal divjes, o.a. een navigatiemenu en content.

Nu heb ik een aantal effecten voor de links ingesteld, A:hover etc.
Deze heb ik gebruikt in het menu.

Als ik nu links in het content div zet, dan gaan deze automatisch ook gebruik maken van die hover instellingen. Is er een manier om dit uit te zetten voor een bepaalde div?

Ik doe het als volgt :
A:link {color: #990033; text-decoration: none}
A:visited {color: #990033; text-decoration: none}
A:hover {color: blue; text-decoration: none}
A.extern:link {color: #990033; text-decoration: none}
A.extern:visited {color: #990033; text-decoration: none}
A.extern:hover {color: blue; text-decoration: none}

A.special:link, A.special:visited {color: #ffffff; text-decoration: none}
A.special:hover {color: blue; text-decoration: none}

De eerste links zijn standaard voor alle links in je document...
De "A.special:link" is specifiek voor een bepaalde groep links --> <a href="www.google.be" class="special">link</a>

Hopelijk bent u hiermee geholpen

[torx]

Of als je de door mithras genoemde divjes gebruikt:

HTML:

<div id="menu"><a href="home/">Home</a> (enz....)</div>

Cascading Stylesheet:

#menu a:hover { /* opmaak */ }

[ Voor 9% gewijzigd door torx op 15-10-2007 15:09 ]

[Verwijderd]

Verwijderd schreef op maandag 15 oktober 2007 @ 14:52:
[...]

Hopelijk bent u hiermee geholpen

Bedankt!

[mithras]

Verwijderd schreef op maandag 15 oktober 2007 @ 15:06:
[...]


Bedankt!

Toch zou ik die methode niet nemen, omdat die meer (onnodige) html nodig hebben dan bij de andere nette oplossing. Zie mijn verhaal en RandomT's voorbeeld voor de betere, gangbare manier.

[Verwijderd]

mithras schreef op maandag 15 oktober 2007 @ 15:27:
[...]

Toch zou ik die methode niet nemen, omdat die meer (onnodige) html nodig hebben dan bij de andere nette oplossing. Zie mijn verhaal en RandomT's voorbeeld voor de betere, gangbare manier.

Maar als je met meerdere verschillende div's werkt en daarin telkens wel dezelfde methode gebruikt voor het opmaken van je link, dan kan je toch voor mijn optie gaan ? Terwijl idd als het voor dat bepaald blok is, jullie methode wel stukken korter en beter is .. Ik werk met de twee, te zien wat er moet gedaan worden.

Btw.. Wat is juist het verschil tsn .test{} en #test{} .. De één definieer je via de class en de ander via de id ... Maar zijn er voor-en nadelen ?

[mithras]

Verwijderd schreef op maandag 15 oktober 2007 @ 15:48:
[...]


Maar als je met meerdere verschillende div's werkt en daarin telkens wel dezelfde methode gebruikt voor het opmaken van je link, dan kan je toch voor mijn optie gaan ? Terwijl idd als het voor dat bepaald blok is, jullie methode wel stukken korter en beter is .. Ik werk met de twee, te zien wat er moet gedaan worden.

Btw.. Wat is juist het verschil tsn .test{} en #test{} .. De één definieer je via de class en de ander via de id ... Maar zijn er voor-en nadelen ?

.class en #id: dat is het verschil. Daarnaast typecast je een element met een class en een id is unique. Veel blokken als unique identificeren maakt het afaik sneller dan alles los met klassen op gaan lossen. Daarnaast is dat de semantisch correcte benadering, en niet met classes