Атрибут style тега <h2>

Описание

Атрибут style позволяет задавать CSS-стили непосредственно для тегов <h1>-<h6>. Это встроенные стили, которые имеют наивысший приоритет (кроме !important).

Пример использования:
<h1 style="color: #2c3e50; font-size: 2.5rem; text-align: center;"> Главный заголовок </h1> <h2 style="border-bottom: 2px solid #e74c3c; padding-bottom: 5px;"> Подзаголовок с границей </h2> <h3 style="background-color: #f8f9fa; border-radius: 5px; padding: 10px;"> Стилизованный заголовок </h3>

Особенности работы:

Тип стилей Приоритет Рекомендация
Встроенные (атрибут style) Наивысший Использовать умеренно
Внутренние (тег style) Средний Для отдельных страниц
Внешние (CSS-файлы) Низший Основной способ стилизации

Динамическое изменение стилей:

<h1 id="dynamic-heading">Интерактивный заголовок</h1> <button onclick="changeStyle()">Изменить стиль</button> <script> function changeStyle() { const heading = document.getElementById('dynamic-heading'); heading.style.color = '#e74c3c'; heading.style.transform = 'rotate(-5deg)'; heading.style.transition = 'all 0.3s ease'; } </script>

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

  • Используйте для разовых стилевых правок
  • Избегайте для основных стилей сайта
  • Помните о приоритете стилей
  • Для сложной стилизации используйте CSS-классы
  • Не рекомендуется для важных стилей (лучше в CSS-файлах)

Ограничения и совместимость:

  • Поддерживается всеми браузерами
  • Не поддерживает медиазапросы
  • Не поддерживает псевдоклассы (:hover и др.)
  • Не поддерживает CSS-переменные (var)
  • Плохо поддается кэшированию

Примечание: Хотя атрибут style удобен для быстрых правок, профессиональная верстка требует использования внешних CSS-файлов. Встроенные стили усложняют поддержку кода и увеличивают вес страницы при массовом использовании.