Атрибут title тега <tt>

Описание

Атрибут title для тега <tt> добавляет всплывающую подсказку к моноширинному текстовому элементу. Хотя тег <tt> устарел в HTML5, атрибут title сохраняет свою функциональность для всех элементов.

Пример использования:
<tt title="Это всплывающая подсказка" style="font-family: monospace;"> Текст с подсказкой </tt>

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

  • Подсказка появляется при наведении курсора (hover)
  • Поддерживает многострочный текст (через \n)
  • Не отображается на мобильных устройствах при обычном касании
  • Может использоваться для улучшения доступности

Практические примеры:

<!-- Подсказка с пояснением --> <tt title="Код возврата: 0 = успех, 1 = ошибка" style="font-family: monospace;"> Код: 0 </tt> <!-- Многострочная подсказка --> <tt title="Функция: calculateSum\nВерсия: 1.0.2\nАвтор: Иван Иванов" style="font-family: monospace;"> calculateSum() </tt>

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

  • Используйте для кратких пояснений (1-2 предложения)
  • Избегайте дублирования видимого текста
  • Для важной информации используйте видимые элементы
  • Сочетайте с атрибутом lang для многоязычных сайтов

Ограничения:

  • Не работает при касании на мобильных устройствах
  • Некоторые браузеры обрезают длинный текст
  • Не поддерживает сложное форматирование
  • Тег <tt> считается устаревшим в HTML5

Современная альтернатива:

<style> .code-text { font-family: 'Courier New', monospace; } </style> <span class="code-text" title="Современная замена тега <tt>"> Текст с моноширинным шрифтом </span>

Accessibility-советы:

  • Не полагайтесь только на title для важной информации
  • Для сложных подсказок используйте ARIA-атрибуты
  • Тестируйте со скринридерами

Примечание: В современных веб-приложениях вместо тега <tt> рекомендуется использовать семантические элементы (<code>, <kbd>, <samp>) с CSS-стилизацией.