HTML тег <pre>

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

Содержимое тега отображается в браузере моноширинным шрифтом (шрифт, в котором все знаки имеют одинаковую ширину).

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

Также не допускается использовать блочные элементы, так как они создают дополнительные отступы, изменяя расстояния между строчками.

Синтаксис

Тег <pre> парный, содержимое пишется между открывающим (<pre>) и закрывающим (</pre>) тегами.

Пример

<!DOCTYPE html>
<html>
   <head>
      <title>Заголовок окна веб-страницы</title>
   </head>
   <body>
       <pre>Крошка сын
               к отцу пришёл,
               и спросила кроха:
               — Что такое 
                хорошо
                и что такое 
                плохо? —</pre>
   </body>
</html>

Результат

Если вам необходимо вставить в HTML документ блок с кодом, используйте для этого тег <code>, вложенный в элемент<pre>. В этом случае поисковые роботы, программы, читающие с экрана сразу поймут, что они имеют дело с программным кодом.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок окна веб-страницы</title>
  </head>
  <body>
    <pre>
      <code>
        body {
          color:orange;
        }
      </code>
    </pre>
  </body>
</html>

Результат

Атрибуты

Атрибут Значение Описание
width number Задает максимальное количество символов в строке.
Не поддерживается в HTML5.

Тег <pre> поддерживает также глобальные атрибуты и атрибуты событий.

Поддержка браузера




Похожие статьи