css-syntax a:hover auf element innerhalb von id und class

Question

Ich möchte denselben Stil anwenden auf

a, a:hover

von Elementen, die sich innerhalb einer id, einer Klasse und eines Elements befinden. Was ist die beste und effektivste Syntax?

Beispiel:

#leftmenu .shortcuts ul li a, a:hover {
  text-decoration: none;
}

Herzliche Grüße, //t

Answer 1

CSS ist nicht so schlau, also müssen Sie den ersten Teil noch einmal explizit ausschreiben. Wie @sdleihssirhc beachten, können Sie auslassen li als ul Elementen wird angenommen, dass sie bereits li s, so dass der Selektor trotzdem funktioniert:

#leftmenu .shortcuts ul a,
#leftmenu .shortcuts ul a:hover {
  text-decoration: none;
}

Ich würde in Erwägung ziehen, das zu geben ul eine id da es Ihr CSS erheblich komprimieren würde:

#lm_ul a, #lm_ul a:hover {
  text-decoration: none;  
}

Answer 2

Oder Sie könnten einfach etwas Ähnliches tun, das für alle Links innerhalb eines Containers mit id="leftMenu" gilt

CSS:

#leftMenu > * a, #leftMenu > * a:hover{ .... }

HTML:

 <ul>
    <li><span><a>item1</a></span></li>
    <li><p><a>item1</a></p></li>
    <li><div><a>item1</a></div></li>
    <li><em><a>item1</a></em></li>
</ul>

Dabei wird jedes Element berücksichtigt, egal was die Links innerhalb des Containers mit id="leftMenu" umhüllt