Частенько случается ситуация, когда к элементу хотелось бы применить не один, а сразу два (а иногда и три) класса. До недавних пор приходилось выкручиваться примерно так:
.red, .redAndBig {color:darkred}
.big, .redAndBig {font-size:200%; font-weight:bold}
Другими словами, в нашем примере мы ввели класс .redAndBig
, который объединяет свойства классов .red
и .big
. Объединённый класс задаём в HTML таким образом:
<p class="redAndBig">Красный. И большой.</p>
Но спецификация CSS Level 2 позволяет задавать у элемента более одного класса. Для этого достаточно разделить названия классов пробелом:
<p class="red big">Красный. И большой.</p>
Получается наглядно и красиво. Огорчает только тот факт, что эта конструкция работает только в Internet Explorer 5+, Opera 4+ и Netscape Navigator 6+. В более ранных версиях браузеров при таком раскладе к элементу не будет применён ни один стиль…