Атрибут class тега <var>
Описание
Атрибут class позволяет назначать один или несколько классов элементу <var>, который используется для обозначения переменных или математических выражений в тексте. Классы применяются для стилизации или взаимодействия с JavaScript.
<p>Формула площади круга: <var class="math-var highlight">S</var> = πr<sup>2</sup></p>
Особенности работы:
- Можно указывать несколько классов через пробел
- Классы чувствительны к регистру
- Наследуют стили от родительских элементов
- Могут комбинироваться с другими атрибутами
Типичные применения классов:
| Тип переменной | Пример класса | Назначение |
|---|---|---|
| Математические | math-var, equation |
Формулы и уравнения |
| Программные | code-var, program-var |
Переменные в коде |
| Выделенные | highlight, important-var |
Важные переменные |
Пример стилизации через классы:
<style>
.math-var {
font-style: italic;
color: #d63384;
}
.highlight {
background-color: #fff3cd;
padding: 0 0.2em;
border-radius: 3px;
}
</style>
<p>Теорема Пифагора: <var class="math-var highlight">c</var><sup>2</sup> =
<var class="math-var">a</var><sup>2</sup> + <var class="math-var">b</var><sup>2</sup></p>
Рекомендации:
- Используйте семантические имена классов
- Придерживайтесь единого стиля именования (BEM, kebab-case)
- Разделяйте ответственность классов
- Избегайте избыточных имен (например, "var-math")
Ограничения:
- Избыточное количество классов усложняет поддержку
- Слишком общие имена могут вызывать конфликты
- Глубоко вложенные селекторы снижают производительность
Примечание: Тег <var> имеет семантическое значение и должен использоваться только для обозначения переменных, а не просто для курсивного текста.