Тег <small>


Описание

Тег <small> уменьшает размер текста на один уровень относительно базового шрифта (обычно с размера medium до small). В HTML5 этот тег получил семантическое значение для обозначения "мелкого шрифта" - второстепенной информации, комментариев, юридических текстов.

Базовый синтаксис:
<p>Основной текст <small>дополнительное примечание</small></p>

Ключевые особенности:

  • Уменьшает размер текста примерно на 20% (от родительского элемента)
  • В HTML5 имеет семантическое значение (а не только визуальное)
  • Может быть вложенным (размер будет уменьшаться с каждым уровнем)
  • Поддерживает все inline-элементы внутри себя
  • Часто используется для юридических текстов, копирайтов, примечаний
Примеры правильного использования:
<!-- Юридическая информация --> <div> <p>Специальное предложение действует до 31 декабря</p> <small>*Акция не распространяется на товары из распродажи</small> </div> <!-- Подпись к изображению --> <figure> <img src="photo.jpg" alt="Пример фото"> <figcaption><small>Фотография сделана 15 мая 2023 года</small></figcaption> </figure> <!-- Копирайт в футере --> <footer> <small>© 2023 Компания. Все права защищены.</small> </footer> <!-- Вложенное уменьшение --> <p> Основной текст <small>Примечание <small>(уточнение)</small> </small> </p>

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

  • Используйте для юридических текстов, примечаний, комментариев
  • Не применяйте просто для уменьшения текста (используйте CSS)
  • Избегайте более 2-3 уровней вложения
  • Для важной информации не полагайтесь только на уменьшение размера
  • Сочетайте с семантическими тегами (<footer>, <aside>)
Ошибочное использование:
<!-- Неправильно: просто для уменьшения текста --> <p><small>Весь этот абзац мелким шрифтом</small></p> <!-- Правильнее --> <p style="font-size:0.8em">Абзац мелким шрифтом</p>

Тег <small> в HTML5 служит для семантического выделения второстепенной информации, а не просто как инструмент изменения размера текста, что важно для доступности и SEO.


Атрибуты

accesskey Горячая клавиша для активации
class CSS-классы для стилизации
contenteditable Разрешает редактирование
data-* Пользовательские данные
dir Направление текста
hidden Скрывает элемент
id Уникальный идентификатор
lang Язык содержимого
spellcheck Проверка орфографии
style Инлайновые стили
tabindex Порядок перехода
title Всплывающая подсказка
translate Определяет возможность перевода

Поддержка браузерами

2.0 1.0 2.0 1.0 1.0