Print

[Rashnu]

mbt H 12
Is er verschil tussen
#navigatie li ul li
en
#navigatie li li ?
Of tussen
ul#navigatie (zoals in jouw uitgewerkte voorbeeld, terwijl ik bij oef 12.1 volgens de stappen van het boek op p. 197 alleen op #navigatie uitkwam)
#navigatie ?
Beide varianten lijken hetzelfde effect te hebben, maar welke heeft de voorkeur? En waarom?

Tussen
#navigatie li:hover a
en
#navigatie li a:hover
is wel verschil ontdek ik net, maar dat merk je pas als je met submenu's met een afwijkend kleurenschema gaat werken.

En wat betekent nu ul #navigatie (dus met een spatie ertussenin) precies ?

[Frances]

Goede vragen! Principe is dat alles wat niet nodig is niet geschreven wordt. Die beantwoordt eigenlijk al de eerste vraag over #navigatie li ul li en #navigatie li li. Als beide op hetzelfde neerkomt dan heeft de laatste de voorkeur.

Zelfde met het tweede voorbeeld ul#navigatie, die hoort dus eigenlijk niet in mijn voorbeeld. Ik heb de (in principe dus slechte) gewoonte om bij de eerste in een rij van CSS-regels over bijv. #navigatie, de naam van het HTML-element, in dit geval ul, te vermelden. Puur voor mijn eigen overzicht. De volgende CSS-regels die dan ook hetzelfde element betreffen maar dan bijv. #navigatie a, geef ik die ul niet. Maar stel je wilt de naam #navigatie toepassen op meerdere elementen, dán wordt het noodzakelijk om te gaan werken met ul#navigatie en bijv. div#navigatie.

Om het maar even af te maken:
li:hover a = de link die staat in het lijstitem-waar-je-met-je-muis-overheen-gaat
li a:hover = de-link-waar-je-met-je-muis-overheen-gaat die staat in het lijstitem. 
ul #navigatie = het element met de naam navigatie dat staat in de ul.
ul#navigatie = de ul met de naam navigatie.