Ранее я рассказывал об использовании тега <pre>, однако чтобы не раздувать статью, рассказал о нём не всё. Так что сегодня добавлю ещё пять копеек.
Между тегами <pre> и </pre> нежелательно пихать что попало. Да, браузер попытается разобраться и вывести пользователю более-менее удобоваримые данные. Однако на это лучше не рассчитывать. И вообще в жизни рассчитывать можно только на себя…
Текст внутри тега <pre> может содержать теги физической и логической разметки, а также ссылки, рисунки и горизонтальные линейки.
А вот теги, которые выполняют переход на новую строку (например, тег Р), не стоит использовать в блоке <pre>. Хотя большинство браузеров при обнаружении тега <p> просто выполнят переход на новую строку, не стоит надеяться, что во всех случаях это будет именно так безобидно. Надежда на авось - плохая привычка для программиста, и особенно для веб-разработчика.
Есть ещё одна особенность. Так как внутри тега <pre> можно использовать другие теги, вам придётся пользоваться кодировкой некоторых символов. Пример:
Если вы, например, решите показать пользователю, как в HTML-коде сделать ссылку, то вы не сможете этого сделать (не только в теге <pre>, но и вообще), потому что браузер будет воспринимать это как HTML-код. А чтобы показать пользователю именно код, придётся вместо символов < и > использовать их коды < и > соответственно. Вот так эти примеры будут отображаться браузером:
Но здесь нас ожидает другая засада - кодировке предшествует символ амперсанда. Соответственно, браузер его тоже НЕ отображает. Поэтому, чтобы отобразить амперсанд (когда это нужно), придётся тоже использовать код вместо символа (&).
На этом всё. Подписывайтесь на канал, чтобы ничего не пропустить.