Webdesign – Cascading Stylesheets
CSS zusammenfassen
Optimierung ___
Zusammenfassen ist immer dann eine gute Idee, wenn gleiche Anweisungen auf verschiedene Elemente, Klassen oder IDs angewendet werden müssen. Angenommen, Sie möchten Ihre Überschriften in Blau und in der Schriftart Verdana darstellen. Das liest sich dann so:
H1 {color : blue; font-family : verdana,arial,helvetica;}
H2 {color : blue; font-family : verdana,arial,helvetica;}
H3 {color : blue; font-family : verdana,arial,helvetica;}
Es geht eleganter. Ein Komma hilft dabei:
H1,H2,H3 {color : blue; font-family : verdana,arial,helvetica;}
Was aber, wenn die Style-Definitionen zwar ähnlich, aber nicht identisch sind? Kein Problem, Sie arbeiten mit Wiederholungen. Ausgangspunkt sind diesmal unterschiedliche Schriftgrößen, jedoch dieselbe Farbe und Schriftart:
H1 {font-size : 1.2.em; color : blue; font-family : verdana,arial,helvetica;}
H2 {font-size : 1.1.em; color : blue; font-family : verdana,arial,helvetica;}
H3 {font-size : 1.0.em; color : blue; font-family : verdana,arial,helvetica;}
Dies ließe sich dann wie folgt abkürzen: H1 {font-size : 1.2.em;}
H2 {font-size : 1.1.em;}
H3 {font-size : 1.0.em;}
H1,H2,H3 {color : blue; font-family : verdana,arial,helvetica;}
Das klappt auch prima, wenn es um die Formatierung von Hyperlinks geht.