Когда вы добавляете текст в код HTML для веб-страницы, скажем, в элементе абзаца, вы не имеете никакого контроля над тем, где эти строки текста будут разбиты, или интервалом, который будет использоваться. Это связано с тем, что веб-браузер будет передавать текст по мере необходимости на основе области, в которой он содержится. Это включает в себя чувствительные веб-сайты, которые будут иметь очень гибкий макет, который изменяется в зависимости от размера экрана, используемого для просмотра страницы. Текст HTML разбивает строку, в которой он должен быть, когда он достигнет конца своей области. В конце концов, браузер играет большую роль в определении того, как текст ломается, чем вы.
Что касается добавления интервала для создания определенного формата или макета, HTML не распознает интервал, добавленный в код, включая пробел, вкладку или возврат каретки. Если вы ставите двадцать пробелов между одним словом и словом, которое появляется после него, браузер отобразит там только одно место. Это известно как коллапс белого пространства, и на самом деле это одна из концепций HTML, с которой многие новые в отрасли борются сперва. Они ожидают, что HTML-пробел будет работать так же, как в программе, например Microsoft Word, но это не то, как HTML-пробел работает вообще.
В большинстве случаев нормальная обработка текста в любом документе HTML является именно тем, что вам нужно, но в других случаях вам может потребоваться больше контроля над тем, как текстовые пространства выходят и где они ломают строки. Это известно как предварительно форматированный текст (другими словами, вы определяете формат). Вы можете добавить предварительно отформатированный текст на свои веб-страницы, используя HTML-код
С использованием Тег
Много лет назад это было обычным явлением для просмотра веб-страниц с блоками предварительно форматированного текста. С использованием
до тег для определения разделов страницы, отформатированный самим типом, был быстрым и простым способом для веб-дизайнеров получить текст для отображения, как он этого хотел. Это было до появления CSS для макета, когда веб-дизайнеры действительно застревали, пытаясь заставить макет использовать таблицы и другие методы только HTML. Это (kinda) отработано, потому что предварительно форматированный текст определяется как текст, в котором структура определяется типографскими соглашениями, а не рендерингом HTML.
Сегодня этот тег не используется так сильно, потому что CSS позволяет нам диктовать визуальные стили гораздо эффективнее, чем пытаться заставить внешний вид в наш HTML, и потому, что веб-стандарты диктуют четкое разделение структуры (HTML) и стилей (CSS). Тем не менее, могут быть случаи, когда текст, предварительно отформатированный, имеет смысл, например, для почтового адреса, где вы хотите заставить разрывы строк или примеры поэзии, где разрывы строк имеют важное значение для чтения и общего потока содержимого.
Вот один из способов использования HTML
тег:
Twas brillig и slithey toves
Сделал ли гир и жуткий
в
WABE
Типичный HTML сбрасывает пробел в документе. Это означает, что каретки возвращаются, пробелы и символы табуляции, используемые в этом тексте, будут свернуты в одно пространство. Если вы набрали вышеуказанную цитату в типичный тег HTML, такой как тег p (paragraph), вы получите одну строку текста, например: Twas brillig и slithey toves Сделал гир и gimble в wabe Значок pre оставляет символы пробела как есть. Таким образом, разрывы строк, пробелы и вкладки поддерживаются в рендеринге этого содержимого браузером. Ввод цитаты внутри до тег для этого же текста приведет к такому отображению: Twas brillig и slithey toves Сделал ли гир и жуткий в WABE до тег больше, чем просто поддерживает пробелы и перерывы для текста, который вы пишете. В большинстве браузеров он написан в моноширинном шрифте. Это делает символы в тексте равными по ширине. Другими словами, буква i занимает столько места, сколько буква w. Если вы предпочитаете использовать другой шрифт вместо моноширинного по умолчанию, отображаемого браузером, вы все равно можете изменить его с помощью таблиц стилей и выбрать любой другой шрифт, который вы хотите, чтобы текст был визуализирован. Следует помнить, что в HTML5 атрибут «width» больше не поддерживается для Под редакцией Джереми Жирара 2/2/17 Что касается шрифтов
HTML5
элемент. В HTML 4.01 ширина указала количество символов, которые будет содержать строка, но это было отброшено для HTML5 и выше.
