Главная/ Cправочник HTML, CSS, Javascript/ HTML справочник : HTML теги, HTML атрибуты, мета теги, спецсимволы/ Tags/ HTML тег style | назначение, синтаксис, атрибуты, примеры

Тег style

Последнее обновление: 23.01.2011

Тег <style> (с англ. стиль, манера) — тег-контейнер, задает таблицу стилей.

HTML: 3.2 | 4 / XHTML: 1.0 | 1.1

Синтаксис


<head>
<style>...</style>
</head>

Атрибуты


dir определяет направление символов:

  • ltr — слева направо
  • rtl — справа налево
disabled флаг. Таблица с установленным флагом не подключается
lang определяет используемый язык
media усторойство, для которого применяется стиль оформления

  • all — все устройства
  • braille — устройства для слепых на основе системы Брайля
  • screen — экран (по умолчанию)
  • print — устройство печати
  • projection — проектор
  • speech — синтезатор голоса
title название таблицы стилей
type MIME-тип блока стилей. Обычно text/css

Пример

Таблица стилей:


<style type="text/css">
a {
color: #287fc3;
text-decoration: underline;
}
a:hover{
text-decoration:none;
}
</style>

Рекомендации по использованию

  • должен быть закрыт слешем (<style…/>)
  • располагается в секции <head>.
  • в документе может быть несколько тегов <style>
  • содержит описание таблиц стилей
  • обязательных атрибутов нет
  • если требуется поддержка старых браузеров, необходимо содержимое тега <style> заключить в комментарии:

    <style type="text/css">
    &lt!--
    ...содержимое...

    -->
    </style

Стили определяют, как элементы HTML будут отображаться браузером. Само содержимое тега не отображается.

Синтаксис данных стиля, правила иерархии и наследования зависят от языка таблиц стиля.

HTML позволяет создавать документы, которые используют специфические особенности средств отображения (графические дисплеи, телеэкраны, портативные устройства, речевые браузеры, устройства на основе системы Брайля и т.д.). Атрибут media, позволяет выборочно загружать и использовать таблицы стилей. Таким образом браузер может сэкономить время, запрашивая по сети только те таблицы, которые применяются непосредственно к текущему устройству. Например, речевые браузеры могут исключить загрузку таблиц стилей, созданных для визуального представления.

Для лучшего структурирования документа таблицы стилей, как правило, выносят в отдельный файл, подключаемый с помощью тега <link>.

Твой код:

Результат: