Внимание! На этой странице вы найдете материал урока из архивного курса по HTML. Курс был написан в 2015, обновлен в 2024 году и по-прежнему актуален для начинающих веб-разработчиков.
Теоретический материал сохранен в исходном виде, а практические задания с автоматической проверкой вынесены в отдельные роадмапы.
Полный список уроков доступен по тегу Архивный курс по HTML и на странице первого урока.
В предыдущем уроке познакомились с тегом <iframe> и научились вставлять на HTML-страницу фрейм с другим веб-сайтом.
На многих сайтах, которые связаны с программированием, есть примеры исходного кода. Этот код чаще всего выделяют с помощью тегов <pre> и <code>.
Теперь разберём каждый тег отдельно.
Блок предварительно отформатированного текста <pre>
Тег <pre> применяется для предварительного форматирования текста. Такой текст отображается со всеми пробелами между словами (вы же знаете, что если в HTML коде написать много пробелов подряд, они все равно превратятся в один при отображении в браузере).
Рассмотрим пример:
<pre>
Текст через пробелы!
</pre>Внутри тега <pre> можно использовать любые элементы, кроме: <small>, <big>, <img>, <sub>, <object>, <sup>
Тег выделения фрагмента кода <code>
Элемент <code> предназначен для выделения, в основном, одной строки программного кода.
Чем отличается <code> от <pre>? Дополнительные пробелы и переносы строки не учитываются. Внутри тега <code> можно использовать теги <br> и <p> ... </p>. Далее пример:
<code>var a = 120;</code>