История css

Термин «каскадные таблицы стилей» был предложен Хокон Виум Ли в 1994 году. Совместно с Бертом Босом он стал развивать CSS.

17 декабря 1996 года была издана рекомендация CSS1.

• Параметры шрифтов. Возможности по заданию гарнитуры и размера шрифта, а также его стиля — обычного, курсивного или полужирного.

• Цвета. Спецификация позволяет определять цвета текста, фона, рамок и других элементов страницы.

• Атрибуты текста. Возможность задавать межсимвольный интервал, расстояние между словами и высоту строки (то есть межстрочные отступы)

• Выравниваниедля текста, изображений, таблиц и других элементов.

• Свойства блоков, такие как высота, ширина, внутренние (padding) и внешние (margin) отступы и рамки.

12 мая 1998 года принята CSS2. Построена на CSS1с сохранением обратной совместимости. Добавление к функциональности:

• Блочная вёрстка. Появились относительное, абсолютное и фиксированное позиционирование. Позволяет управлять размещением элементов по странице без табличной вёрстки.

• Типы носителей. Позволяет устанавливать разные стили для разных носителей (например монитор, принтер, КПК).

• Звуковые таблицы стилей. Определяет голос, громкость и т. д. для звуковых носителей (например для слепых посетителей сайта).

• Страничные носители. Позволяет, например, установить разные стили для элементов на чётных и нечётных страницах при печати.

• Расширенный механизм селекторов.

• Указатели.

• Генерируемое содержание. Позволяет установить текст или картинку, который будет отображаться до или после нужного элемента.

Включение css в html

Существует целых четыре способа включения в HTML-документ таблицы стилей:

• Внедрение - позволяет задавать все правила таблицы стилей непосредственно в самом документе

• Встраивание в теги документа - позволяет изменять форматирование конкретных элементов страницы

• Импортирование - позволяет встраивать в документ таблицу стилей, расположенную на сервере

• Связывание - позволяет использовать одну таблицу стилей для форматирования многих страниц HTML

Включение css в html. Внедрение

Описание стилей располагается в коде Web-странички, внутри тега <STYLE type="text/css">... </STYLE>. Тег <STYLE> размещается внутри контейнера HEAD.

Параметр type="text/css" является рекомендованным и служит для указания браузеру использовать CSS. В этом случае описанные стили можно использовать для элементов, располагающихся в пределах странички.

Включение css в html. Встраивание

Описание стиля располагается непосредственно внутри тега элемента, который описывается. Это делается с помощью параметра STYLE, используемого при применении CSS с большинством стандартных тегов HTML. <tag STYLE="..." >

Этот метод нежелателен, он приводит к потере одного из основных преимуществ CSS – возможности отделения информации от описания оформления информации. Но если необходимо описать лишь один элемент, этот вариант расположения описания стилей также вполне применим.

Включение css в html. Импортирование

Информация о стилях может располагаться в отдельном файле. Расположение описания стилей в отдельном файле имеет смысл в случае, если планируется применять эти стили к большему, чем одна, количеству страниц.

Cоздается обычный текстовый файл. Чаще с расширением CSS (mystyles.css) . C помощью языка CSS в нем описываются необходимые стили. Этот файл размещается на Web-сервере.

В теге <STYLE> с помощью свойства @import можно импортировать внешнюю таблицу стилей в текущую стилевую таблицу.

<style type="text/css"> @import url("имя файла") [типы носителей]; @import "имя файла" [типы носителей];

В качестве типа носителя выступают различные устройства:

• all - Все типы. Это значение используется по умолчанию.

• screen - Экран монитора.

• print- Печатающие устройства вроде принтера.

• aural- Речевые синтезаторы, а также программы для воспроизведения текста вслух. Сюда, например, можно отнести речевые браузеры.

• braille- Устройства, основанные на системе Брайля, предназначенные для слепых людей.

• handheld - Наладонные компьютеры и аналогичные им аппараты.

• projection - Проектор.

• tv - Телевизор.

Т.к. происходит импортирование внешней таблицы стилей в текущую стилевую таблицу, то чтобы не нарушались правила каскада свойство @import следует задавать в начале стилевого блока или связываемой таблицы стилей перед заданием остальных правил.