2015-04-17
1397
Впервые идея форматирования HTML-документов с помощью CSS была рекомендована Консорциумом W3C в 1996 году. Эта рекомендация, которая была обновлена в 1998 году, используется Web-разработчиками и по сей день.
Что значит слово "каскадный"?
Термин "каскадный" означает, что в одной странице HTML могут использоваться разные стили. Браузер, поддерживающий таблицы стилей, будет следовать их порядку (как по каскаду), интерпретируя информацию стилей.
Это означает, что вы можете использовать все три типа стилей, и браузер будет интерпретировать сначала связанные, затем внедренные и, наконец, встроенные стили. Даже если ко всему узлу будут применены образцы стилей, можно будет управлять отдельными аспектами страниц с помощью внедренных стилей, а отдельными областями внутри этих страниц - с помощью встроенных стилей.
Другой аспект каскадирования - наследование (inheritance). Наследование означает, что если не указано иное, то конкретный стиль будет унаследован другими элементами страницы HTML. Например, если вы примените определенный цвет текста в теге <р>, то все теги внутри этого абзаца наследуют этот цвет, если не оговорено иное.
|
|
|
Стандарты каскадных таблиц стилей CSS1 и CSS2.
Спецификация CSS1 была официально утверждена 17 декабря 1996 года и впоследствии пересмотрена 11 января 1999 года. В том далеком 1996 году Консорциум W3C оказался в довольно-таки непростой ситуации. Поскольку специалисты W3C пытались увязать каскадные таблицы стилей с выходом HTML 3, Спецификация CSS1 не утверждалась в качестве официального стандарта очень долгое время. Как следствие, реализация CSS в браузерах тоже сильно запоздала. Более того, из-за весьма безответственного отношения производителей браузеров к CSS, даже частичная поддержка этой новой технологии содержала массу ошибок.
12 мая 1998 года была официально утверждена Спецификация CSS2. Новая версия каскадных таблиц стилей содержала много интересных и полезных нововведений. Прежде всего, новый стандарт предусматривал возможность свободного позиционирования любого элемента относительно окна браузера или элемента-родителя. При этом также предусматривалось «третье измерение», позволяющее накладывать элементы друг на друга в определенной последовательности. Другим важнейшим нововведением в CSS2 стала поддержка различных типов устройств (media types) с возможностью точно определить стилевые спецификации, которые должны применяться при выводе документа на конкретное устройство представления (компьютерный монитор, принтер, сотовый телефон, речевой браузер и т.п.)
Определение и использование каскадных таблиц стилей в HTML.
|
|
|
По мере увеличения количества документов, расположеных на вашем сервере Web, становится все труднее и трулнее заниматься его сопровождением. Особенно это касается оформления документов HTML.
Например при создании документа вы указали для обычных параграфов отступ и шрифт, но через неекоторое время потребовалось изменить эти настройки, вам придется вручную обрабатывать каждый параграф текста. Чтобы сэкономить время и силы, можно использовать так называемые каскадные таблицы стилей Cascading Style Sheets (CSS), разработанные консорциумом World WideWeb Consortium (W3C). Наиболее интересное применение таблиц стилей - для оформления большинства, возможно, даже для всех документов HTML, расположеных на сервере.При этом выполняется подключение (linking) файлов таблиц стилей к документам HTML. Имя файла таблицы стилей должно иметь расширение css.
Конкретизируя содержимое файлов таблиц стилей, можно изменить внешний вид всех документов, подключенных к этим файлам.
Cоздание файлов таблиц стилей
Файлы таблиц стилей содержат определение стилей, которые можно использовать для того, чтобы разом оформить несколько документов HTML, расположеных на одном или нескольких серверах Web.
Приведем пример внешнего вида файла таблицы стилей:
<style> H1{color: red; font-size: 27px; margin-left: 10%; font-weigt: bold} H2{color: green; font-size: 24px; font-family: courier; font-weigt: bold} P.italic{font-style: italic} P.red{color:red}</style>Здесь определены стили для тегов <H1>, <H2>, а также стилевые классы P.italic и P.red.
Определение стиля тега начинается с имени тега (например, <H1>), вслед за которым в фигурных скобках перечисляются параметры стиля. Для стиля с классом <H1> в приведенном примере указаны размер шрифта, равный 24 пунктам, полужирное начертание, красный цвет и отступ с левой стороны на 10% от ширины экрана.
Чтобы определить различные параметры для одного и того же тега, используют классы. Например, класс P.italic задает оформление тега <P>(класс italic) наклонным щрифтом, а класс P.red задает цветовое оформление символов (красным цветом).
