style

by 3 contributors:

Краткое описание

HTML-элемент <style> содержит стилевую информацию для документа или его части. По умолчанию стилевые инструкции внутри этого элемента считаются написанными на CSS.

Атрибуты

This element includes the global attributes.

type
Этот атрибут определяет язык стиля в виде MIME-типа (кодировка не указывается). Этот атрибут необязателен, и при отсутствии считается «text/css».
media
К какому виду медиа должен применяться этот стиль. Значение этого атрибута — media query, которое при отсутствии атрибута будет all.
scoped
Если указан этот атрибут, то стиль применяется только внтури своего родительского элемента. Если не указан, то стиль применяется ко всему документу.
title
Specifies alternative style sheet sets.
disabled
If set, disables (does not apply) the style rules, specified within the element, to the Document.

Примеры

Простая таблица стилей

<style type="text/css">
body {
  color:red;
}
</style> 

Таблица стилей с ограниченной областью действия

<article>
  <div>Атрибут scoped позволяет to include style elements mid-document.
   Внутренние правила применяются только внутри родительского элемента.</div>
  <p>Этот текст должен быть чёрным. Если он красный, ваш браузер не поддерживает атрибут scoped.</p>
  <section>
    <style scoped>
      p { color: red; }
    </style>
    <p>Этот должен быть красным.</p>
  </section>
</article>

Live sample

Спецификации

Specification Status Comment
WHATWG HTML Living Standard
Определение 'style' в этой спецификации.
Живой стандарт Нет отличий от HTML5.
HTML5
Определение 'style' в этой спецификации.
Рекомендация Добавлен атрибут scoped
HTML 4.01 Specification
Определение 'style' в этой спецификации.
Рекомендация  

Совместимость браузеров

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Базовая поддержка (Да) 1.0 (1.7 или ранее) (Да) (Да) (Да)
scoped 20 [1] 21.0 (21.0)[2] Нет Нет Нет
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Базовая поддержка (Да) 1.0 (1.7 или ранее) (Да) (Да) (Да)
scoped ? 25.0 (25.0)[2] Нет Нет Нет

[1] Поддерживается в Chrome с 20+ по 34 при включённом флаге "Enable <style scoped>" или "experimental WebKit features" в chrome://flags. Удалён в Chrome 35+ из-за сложности кода.
[2] Gecko 20 и более новые реализуют псевдо-классы :scope, но должна быть включена настройка layout.css.scope-pseudo.enabled. This is only the case by default in Nightly and Aurora test versions.

См. также

  • Элемент <link>, позволяющий использовать внешние таблицы стилей.

Метки документа и участники

Contributors to this page: teoli, Aleksej, dronov
Обновлялась последний раз: teoli,