Использование элемента <style> для применения простой таблицы стилей к HTML документу:
<html>
<head>
<style>
h1 {color:red;}
p {color:blue;}
</style>
</head>
<body>
<h1>Заголовок</h1>
<p>Параграф.</p>
</body>
</html>
Попробуйте сами »
Определение и использование <style>
Тег <style>
используется для определения информации о стиле (CSS) документа.
Внутри элемента <style>
вы указываете, как HTML элементы должны отображаться в браузере.
Примечание: Когда браузер читает таблицу стилей, он форматирует HTML документ в соответствии с информацией в таблице стилей. Если некоторые свойства были определены для одного и того же селектора (элемента) в разных таблицах стилей, то будет использоваться значение из последней прочитанной таблицы стилей (см. пример ниже)!
Совет: Чтобы создать ссылку на внешнюю таблицу стилей, используйте тег <link>.
Совет: Чтобы узнать больше о таблицах стилей, пожалуйста, прочтите CSS Учебник.
Поддержка браузеров <style>
Элемент | |||||
---|---|---|---|---|---|
<style> | Да | Да | Да | Да | Да |
Атрибуты <style>
Атрибут | Значение | Описание |
---|---|---|
media | media_query | Указывает, для какого носителя/устройства оптимизирован медиаресурс |
type | text/css | Указывает тип носителя тега <style> |
Глобальные атрибуты <style>
Тег <style>
также поддерживает Глобальные атрибуты в HTML.
События атрибутов <style>
Тег <style>
также поддерживает События атрибутов в HTML.
Еще примеры <style>
Несколько стилей для одних и тех же элементов:
<html>
<head>
<style>
h1 {color:red;}
p {color:blue;}
</style>
<style>
h1 {color:green;}
p {color:pink;}
</style>
</head>
<body>
<h1>Это заголовок</h1>
<p>Это параграф.</p>
</body>
</html>
Попробуйте сами »
Связанные страницы <style>
HTML Учебник: HTML CSS
CSS Учебник: CSS Учебник
HTML DOM Справочник: Объект Style
Настройки CSS по умолчанию <style>
Большинство браузеров будут отображать элемент <style>
со следующими значениями по умолчанию:
style {
display: none;
}