Описание
Тег pre - это, по сути, аккуратная «рама» для текста, который нужно показать именно в том виде, как он был набран. Здесь сохраняются все пробелы, переносы и отступы, а браузер обычно выводит такой фрагмент моноширинным шрифтом, что делает его особенно удобным для кода, стихов или специальных схем. При этом внутри pre допустимо применять другие разрешённые элементы форматирования.
Элемент pre действительно выручает в нескольких ситуациях:
- когда нужно красиво отпечатать стихи, где расположение строк важно и задано автором;
- когда отображаются ASCII-рисунки;
- когда вы хотите показать отформатированный фрагмент кода на любом языке программирования.
Примечание: здесь есть один приятный нюанс. Если вы захотите рассказать про HTML-код, аккуратно его оформив, браузер может «спутать» угловые скобки с началом и концом тега - из-за этого код может не отобразиться как надо. Но выход простой: используйте ссылки на символы, чтобы корректно показать угловые скобки и другие специальные знаки.
Атрибуты
Тег pre поддерживает стандартные глобальные атрибуты.
Пример
pre .-. __ / \ __ ( `'.\ /.'` ) '-._.(;;;)._.-' .-' ,`"`, '-. (__.-'/ \'-.__) \ /\ '-' \ , | |\ | \ | | | \ / \|/ _, / __/ / | _/ _.' |/__/ \ /pre