![]() |
![]() |
![]() |
![]() |
Встроенный стиль – самый простой способ задать стиль тега. Включите в тег атрибут style со списком свойств и их значений. Пример:
Броузер, поддерживающий стили, выведет текст заголовка синим и наклонным шрифтом. Область действия такого типа стилей распространяется только на содержимое тега. Используйте встроенные стили в редких случаях, так как если вы захотите сменить дизайн документа, то это потребует от вас значительных усилий, особенно если документ велик.
Стили на уровне документа определяются тегом <Style>. Тег <Style> (за описанием этого тега загляните в НTML справочник) может находиться только внутри тега <head>. Все что находиться внутри тега <style> рассматривается броузером как стилевые правила. Стили, определенный в теге <Style>, действует на все теги документа. Помещайте содержимое тега в HTML комментарий, тогда броузер, поддерживающий стили, все равно распознает содержимой, зато броузер, не поддерживающий стили не выведет стилевые правила на экран, посчитав их комментариями.
В этом примере мы добрались до использования регулярных классов. Внутри тега <style>, был определен родовой класс red тега <h2> (за описанием этого тега загляните в НTML справочник). Чтобы применить это стилевой правило к тегу некоторому тегу <h2>, надо назначить атрибуту class тега <h2> значение, совпадающее с именем родового класса, в данном случае это red. Аналогично используются родовые классы. Определите стилевое правило для родового класса, потом назначьте атрибуту class некоторого тега значение, совпадающее с именем родового класса. Тогда этот тег отобразится в соответствии со стилевым правилом.
В этом примере как заголовок, так и абзац, выведутся курсивом.
Стандарт CSS предусматривает создание отдельных файлов со стилями и присоединение их к документу. Существует несколько способов сделать это:
Чуть позже мы вернемся к внешним таблицам стилей.
Такой принцип объединения стилей называется каскадным, поэтому и таблицы называются каскадными.
На первый взгляд может показаться, что способы присоединения внешние таблиц стилей с помощью директивы @import и тега <link>(за описанием этого тега загляните в НTML справочник) эквивалентны. Это так если в документе один тег <link> и одна директива @import. Если в документе несколько директив @import, то броузер, согласно стандартам CSS, должен слить множество казанных в директивах таблиц в один набор стилевых правил для документа. Если же броузер встретил несколько тегов <link>, то он должен предложить пользователю выбрать стилевой файл для документа, однако на практике современные броузеры, встретив несколько тегов <link>, каскадно их объединяют. Я не советую использовать команду @import, для присоединения внешних таблиц стилей, так как ее поддерживает только Intenet Explorer. |
![]() |
![]() |
![]() |
![]() |