|
|
Что такое CSS
Идея CSS очень проста. Если в HTML вы прямо в документе ставили указание на то, как должен выглядеть тот или иной элемент, то при использовании CSS такие указания выносятся в отдельный блок (который может либо включаться в документ, либо читаться из внешнего файла). Такой простой ход стразу дает массу преимуществ вебмастеру. Прежде всего, значительно облегчается изменение внешнего вида сайта или отдельных его элементов - достаточно изменить определение соответствующего стиля в единственном CSS-файле, и эти изменения распространятся на весь сайт. Второе преимущество - сокращение размеров документов, которое особенно заметно на "красивых" страницах. Первая версия CSS - CSS level 1 - принятая в 1996 и пересмотренная в 1999 году, позволяла оперировать только цветами, шрифтами, отступами и им подобными относительно простыми и частоиспользуемыми элементами. Принятая в 1998 году, спецификация CSS level 2 добавила возможность абсолютного позиционирования элементов, создания стилей для разных типов устройств, использования собственных курсоров, расширила возможности по выбору элементов, к которым должен применяться тот или иной стиль и многое другое. Естественно, что CSS level 2 поддерживает и таблицы стилей, созданные в CSS level 1. В настоящее время консорциум W3C активно ведет разработку стандарта CSS level 3 и CSS level 2 revision 1, которые должны учесть все возрастающие потребности вебмастеров и вебдизайнеров, по созданию современных и удобных сайтов. Следует учитывать, что каскадные таблицы стилей не полностью абстрагируют визуальное представление документа от его содержания - они только позволяет более компактно описать правила визуального представления. И если вы захотите изменить дизайн сайта, то вам все-равно придется переписывать HTML код (правда, сделать это будет проще чем при отсутствии CSS). Значительно больший уровень абстракции можно получить, используя связку языков XML + XSL (из которых, в частности, можно генерировать HTML + CSS), но это намного сложнее, и несколько выпадает из темы данной статьи. Но хватит теории! Давайте попробуем практикой заняться... Есть три способа описать стиль элемента в HTML документе. Самый простой и, практически, не использующий преимуществ CSS способ - это указать стиль внутри тега HTML. Например, написать заголовок второго уровняЕдинственное преимущество, которое можно получить таким образом - это задание некоторых атрибутов текста, которые не поддерживаются тегами HTML. Зато сохраняются все недостатки HTML - указанный стиль относится только к одному тегу и для изменения внешнего вида документа вам придется изменить описание стиля в каждом теге. Второй способ несколько лучше: надо описания стилей заключить внутри тегов . Например, если вы напишете заголовок второго уровня, то получите тот же эффект. Однако, в отличие от предыдущего способа, свойства отображения применятся ко всем тегам H2 в документе. И если, скажем, вам потребуется изменить размер шрифта или цвет всех заголовков второго уровня, то изменить потребуется всего одну строчку. Согласитесь, что это намного удобнее!Однако, у предыдущего способа тоже есть свой недостаток: блок STYLE вам придется скопировать в каждую страницу своего сайта. А если страниц там несколько сотен? И вам понадобится что-то поменять? Неудобно... Но можно победить и эту проблему - с помощью тега LINK. Описав требуемые стили в отдельном текстовом файле (теги STYLE указывать не требуется), вы затем можете написать в секции HEAD документа В некоторых случаях бывает полезно объединить два предыдущих метода - например, если разные секции должны иметь частично разные стили (скажем, отличаться цветом фона). Внутри тега STYLE можно указать Но у внешних файлов тоже есть недостаток: если соединение с сервером не очень хорошее (что не редкость у модемных пользователей), то файл со стилями может и не скачаться... А страничка без стилей обычно выглядит преотвратнейше... Поэтому тут уж вам придется выбирать как лучше поступить. Практика показывает, что таблицы стилей редко бывают больше 2-3 Кб, даже для очень "раскрашенных" страниц. И если ваш веб-сервер умеет "на лету" сжимать страницы (в Apache, например, этим занимается mod_gzip), то такой объем будет для пользователя практически незаметен. Ну а дальше - дело техники: пишется какая-нибудь команда, которая на сервере читает таблицу стилей из внешнего файла (все-таки один файл намного легче редактировать!) и встраивает ее содержимое в страницу, отдаваемую посетителю. В простейшем случае это может быть инструкция SSI, вроде Ссылки:
Страница сайта http://silicontaiga.ru
Оригинал находится по адресу http://silicontaiga.ru/home.asp?artId=5377 |
Страшно подумать, но в июле этого года исполнилось всего 10 лет стандарту HTML 1.0 (который, кстати, так никогда и не был "официально" принят и остался в виде черновика для "внутреннего употребления"). За эти 10 лет HTML прошел очень большой путь, завоевал практически все компьютеры в мире и стал одним из самых известных "компьютерных языков" (все-таки отнести его к языкам программирования рука не поднимается)... И одним из весьма заметных этапов развития HTML стало появление CSS - Cascading Style Sheets или, говоря по-русски, каскадных таблиц стилей.