<dfn>

Расшифровываем термины и сокращения.

Время чтения: меньше 5 мин

Кратко

Скопировано

Тег <dfn> используется для вывода терминов или расшифровки сокращений.

Как пишется

Скопировано
        
          
          <p>  <dfn><abbr>ЧАВО</abbr></dfn> — сокращённая форма  фразы «Часто задаваемые вопросы».  Используется на русскоязычных сайтах в качестве аналога  английской аббревиатуры <abbr>FAQ</abbr></p>
          <p>
  <dfn><abbr>ЧАВО</abbr></dfn> — сокращённая форма
  фразы «Часто задаваемые вопросы».
  Используется на русскоязычных сайтах в качестве аналога
  английской аббревиатуры <abbr>FAQ</abbr>
</p>

        
        
          
        
      
Открыть демо в новой вкладке

Как понять

Скопировано

В тег <dfn> оборачиваются сами термины, а их определения должны содержаться в ближайшем родительском теге <p>, <dl> или <section>.

По умолчанию браузеры применяют к тексту внутри <dfn> курсивное начертание с помощью font-style: italic;.

Атрибуты

Скопировано

Помимо глобальных атрибутов у <dfn> есть атрибут title. Браузер обрабатывает этот атрибут по следующему алгоритму:

  • Если у элемента <dfn> есть атрибут title, то значение атрибута — это и есть термин, который будет раскрываться;
  • Если атрибута title нет, но у <dfn> есть ровно один вложенный элемент — элемент <abbr> с атрибутом title — то термином будет значение title тега <abbr>;
  • В любом другом случае термином считается текст внутри тега <dfn>;

Пример

Скопировано

<dfn> часто комбинируется с тегом <abbr> для раскрытия смысла аббревиатуры. В примере ниже мы оборачиваем «ЧАВО» в <abbr>, а при первом появлении нового термина добавляем <dfn>, указывая более точное определение. Для ссылок на это определение можно использовать тег <a>.

        
          
          <p>  <dfn id="chavo">    <abbr title="Часто задаваемые вопросы">ЧАВО</abbr>  </dfn> — сокращённая форма фразы «Часто задаваемые вопросы».</p><p>  Перед обращением в техподдержку убедитесь, что вы прочитали раздел  <a href="#chavo"><abbr title="Часто задаваемые вопросы">ЧАВО</abbr></a>  и там нет решения Вашей проблемы.</p>
          <p>
  <dfn id="chavo">
    <abbr title="Часто задаваемые вопросы">ЧАВО</abbr>
  </dfn> — сокращённая форма фразы «Часто задаваемые вопросы».
</p>
<p>
  Перед обращением в техподдержку убедитесь, что вы прочитали раздел
  <a href="#chavo"><abbr title="Часто задаваемые вопросы">ЧАВО</abbr></a>
  и там нет решения Вашей проблемы.
</p>

        
        
          
        
      
Открыть демо в новой вкладке