Введение в CSS
1. Что вы уже должны знать Прежде, чем Вы продолжите, у вас должно быть базовое понимание следующих технологий:
# HTML
# XHTML
Если Вы их ещё не знаете, то посетите раздел "КУРСЫ" нашего сайта, откройте там категорию "HTML курсы" и выберите подкатегорию "HTML базовый" или "XHTML".
2. Что такое - CSS ?
# CSS означает Cascading Style Sheets (каскадные таблицы стилей);
# Стили определяют способы отображения элементов HTML;
# Стили, как правило, сохраняются в таблицах стилей;
# Стили были добавлены в HTML 4.0 для решения проблемы;
# Внешние таблицы стилей смогут избавить вас от ненужной работы;
# Внешние таблицы стилей хранятся в CSS-файлах.
# Несколько стилей одной веб-страницы сливаются каскадом в один виртуальный стиль.
3. Стили решают общую проблему
HTML-тэги были первоначально разработаны для определения структуры содержания документа. Например, такие тэги как <h1>, <p>, <table> определяют, что "это заголовок", "а это параграф", "это таблица" и так далее. Об оформлении всех элементов HTML на страницах сайта, как предполагалось, должен заботиться браузер, не используя каких-либо тэгов форматирования.
В свою пору, два главных браузера - Netscape (этот браузер уже мёртв) и Internet Explorer - начали добавлять новые HTML-тэги и их атрибуты к первоначальной спецификации HTML (например такие, как тэг <font> и атрибут color). В связи с этим, HTML стал становиться всё более и более сложным и неудобным для разработки веб-сайтов по сравнению с прежней спецификацией, когда структура содержания документа была отделена от его оформления.
Чтобы решить эту проблему, в World Wide Web Consortium (W3C) - некоммерческая организация, отвечающая за стандартизацию HTML, создали стили как дополнение к HTML 4.0.
Все популярные браузеры поддерживают каскадные таблицы стилей.
4. Внешние таблицы стилей смогут избавить вас от ненужной работы
Стили определяют КАК будут показаны HTML элементы, точно так же как в HTML 3.2 тэг <font> задаёт шрифт и размер текста, а атрибут color задаёт его цвет. Стили обычно сохраняются в файлах с расширением ".css". Внешние таблицы стилей позволяют изменить внешний вид всех страниц вашего сайта, просто путём изменения одного документа CSS!
CSS является прорывом в веб-дизайне, поскольку он позволяет разработчикам управлять стилем нескольких или сразу всех страниц сайта. как веб-разработчик Вы можете определить стиль для каждого элемента HTML и применить его к тому количеству страниц сайта, которое сочтёте нужным. Чтобы сделать глобальное изменение - просто измените стиль и все элементы на сайте станут отображаться по-новому автоматически.
5. Многократные определения стиля сливаются каскадом в один виртуальный стиль
Информация о стиле может быть введена в веб-страницу разными способами. Стили могут быть указаны внутри одного HTML-элемента, внутри <head> элемента HTML страницы, либо во внешнем CSS-файле. Даже на несколько внешних стилей можно ссылаться внутри одного HTML-элемента.
Льющийся каскад
Возникает вопрос: Какой стиль будет использоваться при наличии более одного стиля для определённого HTML-элемента?
Вообще говоря, мы можем сказать, что все стили "сольются каскадом" в одну новую "виртуальную" таблицу стиля по следующим правилам, где номер 4 имеет самый высокий приоритет:
1. Браузер по умолчанию;
2. Внешние таблицы стилей;
3. Внутренние таблицы стилей (внутри тэга <head>);
4. Встроенный стиль (внутри HTML-элемента ).
Таким образом, встроенный стиль (внутри HTML-элемента) имеет самый высокий приоритет, а это значит, что он отвергнет стиль объявленный внутри <head> элемента, во внешнем CSS-файле или стиль принятый в браузере по умолчанию.
Примечание: Если ссылка на внешний стиль будет находиться ниже внутреннего стиля, определённого в <head>-элементе, то внешний стиль отвергнет стиль внутренний.
