САМОСТОЯТЕЛЬНОЕ ОБУЧЕНИЕ ДЛЯ ВЕБ РАЗРАБОТЧИКОВ

HTML Атрибут class



Пример

Использование атрибута class в документ HTML:

<html>
<head>
<style>
h1.intro {
    color: blue;
}

p.important {
    color: green;
}
</style>
</head>
<body>

<h1 class="intro">Заголовок 1</h1>
<p>Параграф.</p>
<p class="important">Обратите внимание, что это важный пункт. :)</p>

</body>
</html>
Попробуйте сами »

Больше примеров "Попробуйте сами" ниже.


Определение и использование

Атрибут class указывает одно или несколько имен классов для элемента.

Атрибут class в основном используется для указания класса в таблице стилей. Однако он также может использоваться JavaScript (через DOM HTML) для внесения изменений в элементы HTML с указанным классом.


Поддержка браузеров

Атрибут
class Да Да Да Да Да

Различий между HTML 4.01 и HTML5

В HTML5 атрибут class может использоваться в любом элементе HTML (он будет проверять любой элемент HTML. Однако, это не обязательно).

В HTML 4.01 атрибут class нельзя использовать в: <base>, <head>, <html>, <meta>, <param>, <script>, <style>, и <title>.


Синтаксис

<element class="classname">

Значение атрибута

Значение Описание
classname Задает одно или несколько имен классов элементу. Чтобы указать несколько классов, разделите имена классов пробелом, например <span class="left important">. Это позволяет объединить несколько классов CSS для одного элемента HTML.

Правила наименования:

  • Должно начинаться с буквы A-Z или a-z
  • Может сопровождаться: Литералы (A-Za-z), десятичные знаки (0-9), дефисы ("-"), и подчеркивание ("_")

Больше Примеров

Пример

Добавление нескольких классов к одному элементу HTML:

<!DOCTYPE html>
<html>
<head>
<style>
h1.intro {
    color: blue;
    text-align: center;
}

.important {
    background-color: yellow;
}
</style>
</head>
<body>

<h1 class="intro important">Заголовок 1</h1>
<p>Параграф.</p>

</body>
</html>
Попробуйте сами »

Связанные страницы

Учебник HTML: Атрибуты HTML

Учебник CSS: Синтаксис CSS

Справочник CSS: Селектор CSS .class

Справочник DOM HTML: Метод DOM getElementsByClassName() HTML

Справочник DOM HTML: Свойство DOM className HTML

Справочник DOM HTML: Свойство DOM classListHTML

Справочник DOM HTML: Объект DOM Style HTML