Ich weiß schon seit langem, dass man in CSS Klassen, Elemente und IDs ansteuern kann. Ein Element steuert man über den entsprechenden Elementnamen an, eine Klasse über .klassenname und eine ID über #idname. Ich wusste auch, dass man diese Anweisungen kombinieren kann, so ruft z.B. der folgende Code alle Absätze, die die Klasse „liste“ haben und gibt ihnen eine rote Farbe.
p.liste {color:red;}Neu dazu gelernt habe ich heute, dass man auch andere html-Attribute als Selektor nehmen kann: Dafür benutzt man eckige Klammern. ZUm Beispiel so:
[title="anfang"] {color:red;}Das gibt allen Elementen, die als titel-Attribut den String „anfang“ haben, eine rote Farbe.
Außerdem habe ich mein Wissen über die Zustands-Selektoren vertieft. Solche Selektoren werden mit Doppelpunkt aufgerufen, z.B. a:hover. Damit ruft man alle Links auf, über die man gerade mit der Maus hovert. Es gibt noch etliche anderer dieser Doppelpunkt-Selektoren, sie heißen korrekt Pseudo-Klassen-Selektoren. Ein sehr cooles Cheat-Sheet gibt es hier.
Man kann auch alle Elemente innerhalb eines bestimmten Elternelements ansteuern. Das geht so:
h3>a {color: red}
Damit färbt man dann alle Links, die in einem h3 liegen, rot ein. Man kann auch das h3 einschränken, indem man z.B. nur h3 einer bestimmten Klasse ansteuert. Hat man zwei Klassen als Bedingung, kann man diese übrigens (weiter mit dem Punkt) aneinander hängen.