Атрибут class тега <dd>


Описание

Атрибут class для тега <dd> (description description) позволяет назначать один или несколько CSS-классов для стилизации элемента описания в списке определений (<dl>). Это основной способ применения стилей к конкретным элементам описания.

Пример использования:
<dl> <dt>HTML</dt> <dd class="tech-description">Язык гипертекстовой разметки для создания веб-страниц</dd> <dt>CSS</dt> <dd class="tech-description important">Язык стилей для оформления веб-страниц</dd> <dt>JavaScript</dt> <dd class="tech-description">Язык программирования для создания интерактивности на веб-страницах</dd> </dl>

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

Синтаксис Описание Пример
Один класс Применяет один класс к элементу class="description"
Несколько классов Применяет несколько классов через пробел class="description highlighted"
Динамическое изменение Классы можно изменять через JavaScript element.classList.add('active')

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

  • Используйте осмысленные имена, отражающие назначение элемента
  • Придерживайтесь единого стиля именования (BEM, kebab-case и др.)
  • Избегайте имен, связанных с внешним видом (например, "red-text")
  • Для модификаторов используйте префиксы (например, "--active")

Пример с CSS и JavaScript:

<style> .term-definition { margin-left: 2em; color: #333; } .term-definition.highlighted { background-color: #ffffcc; padding: 0.5em; } </style> <dl> <dt>API</dt> <dd class="term-definition" id="api-def">Интерфейс программирования приложений</dd> </dl> <script> // Добавляем класс через JavaScript document.getElementById('api-def').classList.add('highlighted'); </script>

Советы по использованию:

  • Используйте классы для групповой стилизации элементов <dd>
  • Комбинируйте с атрибутом id для точечного доступа к конкретным определениям
  • Применяйте классы-модификаторы для изменения состояния (активное, скрытое и т.д.)
  • Для сложных структур используйте вложенные селекторы (например, dl.advanced dd)

SEO рекомендации:

  • Классы не влияют напрямую на SEO, но помогают в структурировании контента
  • Используйте семантичные имена классов для лучшего понимания структуры
  • Избегайте избыточного количества классов на одном элементе

Примечание: Атрибут class является глобальным и может использоваться на любом HTML-элементе. Для тега <dd> он особенно полезен при создании стилизованных списков определений с различными типами контента.