Какой html код задает вывод текста в две строки
Перейти к содержимому

Какой html код задает вывод текста в две строки

  • автор:

Тег
HTML перенос строки

Тег
указывает место переноса строки в тексте HTML страницы. Тег br ставится перед местом конца строки, текст после тега будет выведен с новой строки.

Стоит отметить, что тег
устанавливает границу между строками (означает разрыв строки), а не делит текст на абзацы. Чтобы определить абзацы в тексте HTML документа используйте тег .

Синтаксис

Текст первой строки
Текст второй строки.

Отображение в браузере

В примере далее использован разрыв строк
:

Текст первой строки.
Текст второй строки.

Для сравнения, разделение текста на абзацы

:

Текст первого абзаца.

Текст второго абзаца.

Пример использования
в HTML коде

 

Это первая строка обычного текста на веб-странице. В конце перенос строки
И вот уже вторая строка текста.

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

Тег Google Chrome Internet Explorer Mozilla FireFox Safari Opera
Да Да Да Да Да

— элемент переноса строки

HTML-элемент устанавливает перевод строки в тексте (возврат каретки). Он полезен при написании поэмы или адреса, где важно деление на строки.

Интерактивный пример

Как мы видим из примера выше, элемент
поставлен в том месте, где мы хотим перенести строку. Текст после
начинается со следующей строки текстового блока.

Примечание: Не используйте для увеличения разрыва между строками в тексте; используйте CSS-свойство margin элемента .

Атрибуты

Устаревшие атрибуты

Определяет, где начинается следующая строка после перевода строки.

Стилизация с CSS

Элемент
имеет единственную цель – создать разрыв линии в блоке текста. Таким образом, он не имеет размеров или визуального стиля как такового. Есть всего несколько свойств, которые вы можете стилизовать.

Вы можете установить значение margin на
чтобы увеличить расстояние между линиями в блоке, но это плохая практика – лучше использовать свойство line-height для этой цели.

Примеры

Простой br

В следующем примере мы используем элемент
для разрыва линий в почтовом адресе:

br /> 331 E. Evelyn Avenuebr /> Mountain View, CAbr /> 94041br /> USAbr /> 

Результат будет выглядеть так:

Проблемы доступности

Разделять абзацы в тексте, используя
не только плохая практика, но и проблема для людей, которые используют программы чтения с экрана. Программы чтения могут сообщать о наличии элемента, но не содержимом в
. Это может привести к путанице и разочарованию для человека, использующего программу чтения с экрана.

Техническая сводка

  • Категории контентаОсновной поток, текстовый контент.
  • Разрешённое содержимое Отсутствует, это пустой элемент.
  • Пропуск теговДолжен иметь открывающий тег, но не закрывающий тег. В XHTML документах элемент пишется как
    .
  • Допустимые родительские элементы Любой элемент, который поддерживает текстовый контент.
  • Интерфейс DOMHTMLBRElement

Спецификации

Specification
HTML Standard
# the-br-element

Совместимость с браузерами

BCD tables only load in the browser

Смотрите также

  • Элемент
  • Элемент

Found a content problem with this page?

  • Edit the page on GitHub.
  • Report the content issue.
  • View the source on GitHub.

This page was last modified on 19 нояб. 2023 г. by MDN contributors.

Your blueprint for a better internet.

MDN

Support

  • Product help
  • Report an issue

Our communities

Developers

  • Web Technologies
  • Learn Web Development
  • MDN Plus
  • Hacks Blog
  • Website Privacy Notice
  • Cookies
  • Legal
  • Community Participation Guidelines

Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998– 2024 by individual mozilla.org contributors. Content available under a Creative Commons license.

Какой html код задает вывод текста в две строки

На этой странице:

  • Браузер игнорирует концы строк
  • Принудительный разрыв строки

Браузер игнорирует концы строк

В коде стихотворение записано, как ему и полагается, — на 4 строчках:

Браузер выводит стихи как единый абзац Хотелось бы показать стихотворение по-человечески. Давайте попробуем сделать каждую строку отдельным абзацем:

Результат показан на иллюстрации:

Проверьте сами: Первый HTML-документ (вариант 2)

Получилось! Однако пустые строки в начале каждого абзаца смотрятся не очень красиво. Но HTML позволяет задать принудительный переход на новую строку внутри абзаца.

Принудительный разрыв строки

Строчный элемент BR заставляет браузер продолжить вывод абзаца с новой строки. Тег не имеет парного тега.

Посмотрите теперь на стихи. К ним добавлены заголовок и имя автора. Стихи смотрятся, как в книге:

Красиво! Это потому, что вывод стихов записан так:

Элемент BR — строчный . Он задаёт принудительный перевод строки, но перед ним и после него дополнительного перевода строки не делается.

“Строчность” этого элемента кажется немного странной, но дело в том, что BR кодирует собой непечатаемый символ перевода строки. Как и любой другой символ, этот символ выводится в текущее место строки, но его действие отличается от действия обычного печатаемого символа — этот символ заставляет браузер переводить строку.

Элемент BR оказался полезен для разметки стихотворных строчек. Но не используйте BR для вывода обычного текста.

Типичная ошибка новичка: размечать элементом BR концы строк внутри абзаца. Разработчик ориентируется при этом на ширину своего окна и текущий размер шрифта. В окнах другого размера и при другом кегле это будет приводить к “гребёнке” на экране.

Чтобы продемонстрировать эту ошибку, Вася написал такой код:

В конце каждой строки Вася поставил BR , чтобы текст выглядел на экране так же, как в коде (жёлтыми квадратиками на рисунке условно обозначены места расположения элемента BR ):

Когда Вася уменьшил окно браузера, то увидел на экране изломы строк, возникшие в местах расположения элемента BR :

Элементы BR помешали браузеру нормально отформатировать строки на экране. Если бы их не было, гребенки бы не получилось:

Не используйте тег вместо тега для отделения абзацев. Тег вставляет перед абзацем пустую строку: она выделяет абзац на экране и помогает чтению.

Не записывайте длинные абзацы. Длинные абзацы всегда читать сложно, особенно, если это не художественное, а техническое изложение. Читать с экрана труднее, чем со страниц бумажной книги. Поэтому экранные абзацы должны быть очень короткими.

Не рекомендуется записывать абзацы длиннее 4–5 строк в расчёте на 80-символьные строки. Ниже представлен абзац именно такой длины (Г. Х. Андерсен, “Дюймовочка”).

А старая жаба сидела внизу, в тине, и убирала свое жилище тростником и жёлтыми кувшинками — надо же было приукрасить всё для молодой невестки! Потом она поплыла со своим безобразным сынком к листу, где сидела Дюймовочка, чтобы взять прежде всего её хорошенькую кроватку и поставить в спальне невесты.

Какой html код задает вывод текста в две строки

Определяет текстовый абзац. Тег

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

Синтаксис

Текст

Атрибуты

align Определяет выравнивание текста.

Также для этого тега доступны универсальные атрибуты и события.

Закрывающий тег

HTML5 IE Cr Op Sa Fx

    Тег P  

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat.

Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.

Статьи по теме

  • Абзацы
  • Блочные элементы
  • Блочные элементы
  • Строчные элементы
  • Структура HTML-кода
  • Текст

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *