Справочник HTML

Цитаты в HTML: <blockquote>, <q> и cite

Для отдельной длинной цитаты используется <blockquote>, а для короткой фразы внутри предложения — <q>. Эти элементы передают смысл, а внешний вид задаётся CSS.

Рабочий пример

<figure>
  <blockquote cite="https://example.com/article">
    <p>Хороший интерфейс объясняет себя действиями.</p>
  </blockquote>
  <figcaption>Автор, <cite>Название статьи</cite></figcaption>
</figure>

Атрибут cite хранит адрес источника, но браузер обычно не показывает его. Поэтому видимую ссылку или подпись стоит добавить отдельно, например через figcaption и элемент cite.

Когда применять

Не заключай в blockquote любой выделенный абзац. Элемент нужен именно для чужих слов; собственный акцент лучше оформить классом или aside.

Проверь пример самостоятельно: измени исходные данные, убери одну строку и сравни результат. Такой короткий эксперимент помогает увидеть роль каждого свойства или метода и не превращает обучение в механическое копирование.

Частые ошибки

• Использовать цитату только для визуального отступа
• Скрывать источник только в атрибуте cite
• Вручную добавлять кавычки вокруг q