Kombination
Sie müssen nicht mehrere Selektoren mit denselben Attributen wiederholen, sondern müssen die Selektoren lediglich durch Kommas (,) trennen.
Sie haben beispielsweise den folgenden Code:
| h2 { Farbe: rot; } .thisOtherClass { Farbe: rot; } .yetAnotherClass { Farbe: rot; } |
Dann können Sie schreiben:
| h2, .thisOtherClass, .yetAnotherClass { Farbe: rot; } |
Verschachtelt
Wenn CSS gut strukturiert ist, besteht keine Notwendigkeit, zu viele Klassen oder Bezeichnerselektoren zu verwenden. Dies liegt daran, dass Sie Selektoren innerhalb von Selektoren angeben können. (Oder besser gesagt, Kontextauswahl – vom Übersetzer)
Zum Beispiel:
| #Spitze { Hintergrundfarbe: #ccc; Polsterung: 1em } #top h1 { Farbe: #ff0; } #top p { Farbe: rot; Schriftstärke: fett; } |
Dies eliminiert unnötige Klassen- oder Bezeichnerselektoren, wenn es wie folgt auf HTML angewendet wird:
| <div id="top"> <h1>Schokoladencurry</h1> <p>Das ist mein Rezept für die Zubereitung von Curry rein mit Schokolade</p> <p>Mmm mm mmmmm</p> </div> |