Когда нескольких свойств прописываются в одной декларации, то чтобы сэкономить место и сделать более читабельней твои CSS-файлы, я рекомендую использовать сокращённый синтаксис. Как использовать доступные CSS-сокращения я описал в моей статье Эффективный CSS с сокращёнными свойствами, поэтому я направляю тебя туда, вместо того, чтобы описывать детали здесь.
Когда у нескольких типов, классов или идентификаторов элемента прописаны одни и те же свойства, ты можешь сгруппировать селекторы, чтобы не указывать одинаковые свойства несколько раз. Это сэкономит место - потенциально очень много. Ты можешь прописывать все селекторы на одной строке или разделять их переносом на другую строку. Например, чтобы для всех элементов заголовков указать семейство шрифтов (font family), цвет и отступы, ты можешь написать CSS следующим образом:
Частенько случается ситуация, когда к элементу хотелось бы применить не один, а сразу два (а иногда и три) класса. До недавних пор приходилось выкручиваться примерно так:
Другими словами, в нашем примере мы ввели класс .redAndBig, который объединяет свойства классов .red и .big. Объединённый класс задаём в HTML таким образом:
<p class="redAndBig">Красный. И большой.</p>
Но спецификация CSS Level 2 позволяет задавать у элемента более одного класса. Для этого достаточно разделить названия классов пробелом:
<p class="red big">Красный. И большой.</p>
Получается наглядно и красиво. Огорчает только тот факт, что эта конструкция работает только в Internet Explorer 5+, Opera 4+ и Netscape Navigator 6+. В более ранных версиях браузеров при таком раскладе к элементу не будет применён ни один стиль…
Каскадные таблицы стилей, или CSS (от английского Cascading Style Sheets), являются следствием дальнейшего развития HTML и дают нам возможность перейти на следующий уровень представления информации. Таблицы стилей позволяют разделить смысловое содержимое странички и его оформление.
Как мы помним, в первых версиях стандарта HTML не было предусмотрено никаких средств для управления внешним видом информации. Общая концепция гипертекста была направлена на доступность информации для любых устройств, способных воспроизводить текст. Для разметки рекомендовалось использовать только логические теги, определяющие заголовки, подзаголовки, списки, абзацы, цитаты и т.д. - то есть те элементы, которые и составляют структуру документа. Интерпретация же внешнего вида оставалась полностью на совести оконечного терминала.
Главная цель этой статьи - убедить прочитавшего в том, что CSS в дизайне не просто нужен, он необходим (речь идет о вебдизайне). CSS удобнее, чем JavaScript (когда необходимо сделать меню и т.д.), меню на нем гораздо лучше, чем графическое (ведь мы говорим о техническом дизайне).
Страшно подумать, но в июле этого года исполнилось всего 10 лет стандарту HTML 1.0 (который, кстати, так никогда и не был "официально" принят и остался в виде черновика для "внутреннего употребления"). За эти 10 лет HTML прошел очень большой путь, завоевал практически все компьютеры в мире и стал одним из самых известных "компьютерных языков" (все-таки отнести его к языкам программирования рука не поднимается)... И одним из весьма заметных этапов развития HTML стало появление CSS - Cascading Style Sheets или, говоря по-русски, каскадных таблиц стилей.