CSS
или
каскадные таблицы стилей.

- Что же представляют собой каскадные таблицы стилей?
- Как они могут помочь нам?
- Как они создаются, в конце концов?
- И нужно ли их использовать?

Представте такую ситуацию.
Вы создали сложный Web-сайт с большим количеством объемистых страниц. Текст этих страниц очень сложно отформатирован: обильно используются различные шрифты разных цветов и размеров, жирное и курсивное выделения и т. п. В частности, все цитаты выделены красным курсивным шрифтом. Сайт создан, опубликован и достаточно давно работает; посетители довольны, никаких неполадок нет, все ошибки давно исправлены, и вы о своем сайте уже, честно говоря, забыли.

Вдруг, откуда ни возьмись, — распоряжение начальства: срочно выделить цитаты на сайте еще и уменьшенным шрифтом. (Этому начальству всегда нечего делать, как давать идиотские указания...) А цитат у вас хватает на всех страницах, вдобавок они разбросаны по всему тексту так, что их нужно еще и поискать. Вспомним также, что сайт очень большой, и страницы его также велики.

Ваши действия?

Чтобы уменьшить шрифт цитаты, его необходимо выделить и выбрать в раскрывающемся списке размеров нужный пункт. Сами понимаете, это крайне трудоемко. Можно также попытаться воспользоваться мощнейшими возможностями, предлагаемыми диалоговым окном Find and Replace (имеется в виду веб-редактор macromedia dreamweaver). Но. чтобы это сделать, надо правильно ввести подстроки для поиска и замены, для чего нужно долго экспериментировать. Наконец можно воспользоваться регулярными выражениями, но это вообще занятие не для слабонервных. Выходит, так и придется форматировать цитаты вручную?

Почему мы вынуждены так поступать? Чтобы объяснить это, надо немного рассказать о принципах написания и хранения программ и используемых ими данных.

Возьмем любую программу, например Microsoft Word. Данные этой программы (документ) находятся в одном файле (с расширением doc), а сама программа — в другом (исполняемый файл ехе). Если нужно изменить программу (скажем, вы получили новую версию), вы просто переписываете файл программы, не трогая данные. Если вам надо изменить данные, то вы просто откроете их в программе и измените, а сама программа останется неизмененной.

В этом случае говорят, что данные и их представление (т. е. описание правил отображения этих данных или программа, отображающая эти данные) хранятся отдельно. Преимущество такого подхода в том, что мы можем заменить представление, не трогая сами данные, или отредактировать данные, не трогая представления. Все современные программные продукты строятся на таком принципе; благодаря этому мы можем установить на свой компьютер новую версию программы, сохранив созданные в ней данные.

Это обычные программы. А что же HTML?

Беда HTML в том, что данные и их представление хранятся в одном файле. Более того, они представляют собой единое целое. Откройте любой HTML-файл в текстовом редакторе (например, Блокноте) и посмотрите на него. Текст перемешан с тегами форматирования самым причудливым образом. Найти какую-то нужную информацию в "сыром" HTML-коде — проблема. И еще большая проблема — изменить способ ее представления: для этого надо "перелопачивать" весь файл с риском повредить сами данные. Это очень неудобно, но что ж поделаешь — таков уж этот HTML...

И все же было бы очень неплохо создать некий набор правил форматирования различных фрагментов текста в зависимости от их назначения. Этот набор правил хранился бы в отдельном файле, независимо от содержимого Web-страницы. А в HTML-файл записать только сам текст, разбитый на логические фрагменты тегами <р> и <нп>. Таким образом, и данные хранятся отдельно от представления, и форматированы они гораздо "прозрачнее", и нужную информацию искать значительно проще.

У такого подхода есть еще одно преимущество: становится намного легче изменять представление страниц. Скажем, если нам нужно изменить форматирование какого-либо типа фрагментов текста, мы просто корректируем соответствующие ему правила в файле правил. После этого Web-обозрезатель при следующей загрузке этой страницы покажет все так, как нам надо. Таким образом, мы можем наконец-то изменить вид наших многострадальных цитат редактированием всего одного файла вместо того, чтобы править все страницы.

Хорошо? А как вам понравится, если окажется, что все это существует уже достаточно давно, с 1997 года? Да-да, существует и называется каскадными таблицами стилей.

Каскадные таблицы стилей или просто таблицы стилей (CSS — Cascading Style Sheets) — это набор правил, описывающих форматирование разных фрагментов HTML-кода и хранящихся отдельно от него. Одно такое правило, отображающее форматирование какого-то одного фрагмента или однотипной группы фрагментов кода, называется стилем. Таблицы стилей описываются на особом языке CSS и хранятся в особых файлах с расширением сss, хотя могут быть внедрены в саму Web-страницу.

Изучение CSS является не слишком сложной наукой. Хотя, если признаться честно, я пока ей не овладел. Катастрофически не хватает времени. Но я это обязательно сделаю.

Я предлагаю вам два способа изучения:

1. Вы можете скачать в разделе учебники несколько не плохих самоучителей по CSS и корпеть над ними самостоятельно. При надлежащем усердии, у вас обязательно все получится.
2. Более простой и быстрый способ.
   Вы можете воспользоваться опытом других людей. Для этого существует прекрасный курс Евгения Попова, сделанный в виде видеоуроков. Кроме CSS он содержит много других необходимых вам знаний, и позволит вам сэкономить много сил и времени.
   Чтобы ознакомиться с этим курсом просто перейдите по этой ссылке» или нажмите на следующую картинку.
   

Если вы нашли на моем сайте что-то интересное или полезное для вас, то можете порекомендовать его своим друзьям.
Для этого можно воспользоваться этой формой.
Я буду вам крайне признателен.