CSS стили – каскадные таблицы стилей
CSS (от английского Cascading Style Sheets – каскадные таблица стилей) – это специальная технология для описания внешнего вида электронного документа, то есть для его оформления. Описание осуществляется посредством языка разметки. Чаще всего CSS применяют для оформления документов формата HTML или XHTML, но также возможно применение к XML, XUL, SVG и другим типам документов.
CSS обеспечивает более эффективную, быструю и удобную работу электронных документов и web приложений. CSS стили помогают обрабатывать такие элементы оформления страниц, как шрифт, цветовая гамма, позиционирование элементов, обеспечивает более эффективную работу с изображениями.
В отличие от HTML, где для каждого элемента все его свойства задавались отдельно, в CSS создается блочное описание свойств. Впоследствии, полученные блоки могут быть применены для любого элемента документа. В результате, применение CSS обеспечивает повторное использование кода (подобное свойство существует в объектно-ориентированном программировании), что в свою очередь значительно снижает размер исходного кода и упрощает возможность модификации стилей электронного документа. Таким образом, если web-мастеру необходимо поменять оформление какого-либо элемента, ему не придется долго искать конкретный элемент в исходном тексте страницы, а лишь необходимо изменить описание соответствующего блока в файле каскадных таблиц.
В конце девяносто шестого года каскадные таблицы приобрели свою заслуженную популярность. Но возможности использовать эту технологию на всю мощность не было. Поскольку развитие web-браузеров было не столь прогрессивным, то при помощи CSS можно было лишь работать со шрифтами и цветовой палитрой. Все остальные свойства каскадных таблиц игнорировались. Поэтому, в первое время основная нагрузка лежала на HTML. Некоторые браузеры вообще были не способны воспринимать CSS.
Со временем и развитием каскадных таблиц стилей развивались и web-браузеры. В результате, на сегодняшний день, все браузеры обладают возможностью поддержки CSS стилей. Поэтому современные сайты обладают поистине шикарным дизайном. И все благодаря грамотному применению каскадных таблиц стилей.
Существует целое множество причин, по которым рекомендуется использовать CSS.
1). При использовании CSS, стили и HTML код документа хранятся отдельно, в разных файлах. Таким образом, появляется возможность стилизовать различные web-документы используя общий стиль, подгружаемый из одного файла.
2). Использование каскадных таблиц значительно уменьшает размер исходного кода, что в свою очередь увеличивает скорость загрузки страниц. В результате уменьшается нагрузка на сервер. В итоге получается довольно приятный результат: страницы загружаются намного быстрее, сервер терпит более «мягкую» нагрузку, а пользователь получает максимальное удовольствие от пребывания на сайте.
3). Каскадные таблицы имеют очень полезное свойство – кэширование. То есть при открытии страницы в память web-браузера загружается файл CSS стилей, web-браузер его распознает и запоминает. Таким образом, при следующем открытии страницы web-браузер уже будет уметь распознавать эти стили. Принцип работы аналогичен работе кэш памяти в Windows – сначала проверяется соответствие с содержимым кэш памяти и при отсутствии необходимой информации загружается новая. А если в кэш памяти присутствует нужные данные, то их использование уже осуществляется непосредственно из кэш. Такой процесс обеспечивает наиболее эффективную работу с ресурсами. Тоже самое и в браузере. Благодаря этой технологии, страницы открываются значительно быстрее.
4). Применение CSS «облегчает» документ. Он становится более читабельным, не нагруженным громоздкими многоуровневыми конструкциями тегов. Стили дают возможность полностью отказаться от табличной верстки.
Исходя из этих пяти причин, можно сделать четкий вывод, что использование технологии каскадных таблиц стилей довольно выгодный и эффективный шаг на пути создания качественного и современного web-ресурса.
Почему таблицы стилей называются каскадными? Все просто. Каскад представляет собой некоторую иерархию применения правил.
Существует четыре способа применения правил в случае с типами таблиц:
- Пользовательский стиль, который позволяет переопределять все остальные стили.
- Встроенный стиль
- Внедренный стиль
- Связанный и импортированный стили. Эти стили практически одинаковы и по значению зачастую приравниваются друг к другу. Но есть одно небольшое различие, которое в некоторых случаях является немалым преимуществом.
Встроенный тип превосходит внедренный, а внедренный в свою очередь имеет некоторые преимущества перед встроенным стилем.
Различают шесть типов таблиц:
- Стиль браузера. Это стандартный стиль браузера. Используется в том случае, когда какой-нибудь элемент не описан при помощи таблиц стиля.
- Пользовательский стиль. В этом случае пользователь может переопределить заданные стили. Используется довольно редко.
- Встроенный стиль. Данный стиль определяется в самом элементе с применением атрибута Style. Все же этот стиль не является идеальным.
- Внедренный стиль. Управляет стилем одного документа. Так же как и встроенный стиль использует атрибут Style.
- Связанный стиль. Используется связь CSS файла с HTML документом. Связь реализуется посредством элемента link. Этот элемент размещается в разделе HEAD web-документа. Благодаря применению такого присоединения файла стилей исходный текст документа становится намного меньше, а повторное использование кода облегчит процесс добавления новых стилей и модификации уже существующих.
- Импортированный стиль очень похож на связанный, но в целом имеет небольшие различия.
Каскад позволяет использовать несколько таблиц стилей. В результате, будет определена та, которая поддерживается браузером. Это довольно удобный ход.
Недостатки применения CSS стилей.
Есть два существенных недостатка. Во-первых, это неважная кроссбраузерная совместимость, проще говоря, различные браузеры немного по разному интерпретируют css. Эта проблема частично решается заданием Doctype. Во-вторых, проблема оценки результата в процессе верстки web приложения. Связь кода и стилей не явная и для просмотра результатов вам потребуется запускать приложение на выполнение. Для HTML верстки есть визуализированные редакторы, позволяющие приблизительно оценить работу с применением css.
Разработчики со всего мира пользуются технологией CSS. Благодаря этой технологии в сети Интернет появляются красочные сайты, отвечающие всем требованиям современного сайтостроения. С применением каскадных таблиц стилей дизайнеры реализуют самые смелые свои идеи и задумки. Технология CSS стала настоящим переворотом в индустрии web-дизайна, новым словом в процессе проектирования web-ресурсов.
