<code>

Тег <code> используется для выделения фрагмента кода, который должен отображаться моноширинным шрифтом и сохранять пробельные символы и переносы строк.

Примеры использования

Показать код:

<p>Приведём фрагмент кода:</p>
<code>
function sum(a, b) {
  return a + b;
}
</code>

Перечислить переменные:

<p>Вы можете объявить переменные с помощью ключевых слов <code>var</code>, <code>let</code> или <code>const</code>.</p>

Показать HTML-теги:

<p>Используйте<code>&lt;code&gt;</code> тег, чтобы отобразить код.</p>

Для чего использовать тег <code>

• Отобразить фрагменты кода на веб-странице.
• Отформатировать код моноширинным шрифтом с сохранением пробелов и переносов строк.
• Выделить код. Используйте тег с библиотекой подсветки синтаксиса, чтобы показать цветную кодировку синтаксиса.
• Отобразить сочетания клавиш или комбинаций.
• Показать имена переменных, функции или методы.
• Выделить URL-адрес или фрагменты кода, содержащие URL-адреса.

Глобальные атрибуты

Тег поддерживает все глобальные атрибуты HTML.

Ограничения

Элемент <code> не следует использовать для форматирования текста типографским способом. Тег предназначен для отображения кода, а не для обычного текста. Кроме того, <code> не нужно использовать для синтаксиса разметки — для этого больше подходит <pre>.

Нюансы

• Если <code> содержит HTML-элементы <, > или &, то их нужно экранировать с помощью <, > или &.
• Если тег используется для отображения кода с отступом, то пробелы или табуляции, используемые для отступа, могут привести к тому, что код переместится на следующую строку (если элемент контейнера недостаточно широк).

Чем заменить тег

Чтобы показать код, используйте тег <code>. Однако, если вам нужно отобразить синтаксис разметки или текст, который должен отображаться с форматированием фиксированной ширины, используйте тег <pre>.

«Доктайп» — журнал о фронтенде. Читайте, слушайте и учитесь с нами.