Урок с практикой по HTML (Онлайн курсы)
Выбрать другой урок из курса
Обсуждение
Теория урока

Форматирование кода тегами PRE и CODE

На многих сайтах, которые связаны с программированием, есть, разумеется, код. Этот код чаще все выделяют при помощи тегов pre и code. Теперь разберем каждый тег раздельно.

О теге PRE

Тег pre применяется для форматирования текста. Такой текст отображается со всеми пробелами между словами (вы же знаете, что если в HTML коде написать много пробелов подряд, они все равно превратятся в один). То есть текст выведится в браузер так же, как написано между <pre> ... </pre>. Рассмотрим пример первый.

Пример 1
<pre>
Текст через пробелы!
</pre>

Внутри тега pre можно использовать любые элементы, кроме <small> <big> <img> <sub> <object> <sup>

О теге CODE

А вот HTML элемент code нужен для выделения, в основном, одной строки программного кода. Чем отличается code от pre? Дополнительные пробелы и переносы строки не учитываются. Но внутри тега code можно использовать теги <br> и <p> ... </p>. Смотрим пример два.

Пример 2
<code>var a = 120;</code>
<
×
>
Не публикуйте свой код прямо в комментариях. Во-первых, он плохо отображается. Во-вторых, он может содержать для кого-то «спойлеры», т.е. ответы на практику. Воспользуйтесь специальными сервисами: cssdeck.com или jsfiddle.net.
Комментарии, содержащие код (пару строк не считается), будут безжалостно удаляться.