Главная » Языки программирования

Example

На чтение 6 мин
Содержание
  1. Разрыв строки
  2. Принудительный разрыв строки
  3. Указание возможности для безопасного разрыва строки
  4. — элемент переноса строки
  5. Интерактивный пример
  6. Атрибуты
  7. Устаревшие атрибуты
  8. Стилизация с CSS
  9. Примеры
  10. Простой br
  11. Проблемы доступности
  12. Техническая сводка
  13. Спецификации
  14. Совместимость с браузерами
  15. Смотрите также
  16. Found a content problem with this page?
  17. MDN
  18. Support
  19. Our communities
  20. Developers
  21. : элемент «Разрыв строки»
  22. Try it
  23. Attributes
  24. Deprecated attributes
  25. Стиль с CSS
  26. Examples
  27. Simple br
  28. Accessibility concerns
  29. Technical summary

Разрыв строки

Есть два элемента, которые можно использовать для разрыва строк в контенте: это элементы br и wbr .

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

Элемент br устанавливает разрыв строки. Соглашение по стилям для данного элемента заключается в переходе последующего содержания на новую строку. В таблице 8-13 представлен элемент br .

Элемент br
Тип элемента Фразовый
Разрешенные родительские элементы Любой элемент, который может содержать фразовый контент
Локальные атрибуты Нет
Содержание N/A
Стиль тегов Тег пустого элемента
Новый в HTML5 Нет
Изменения в HTML5 Нет
Соглашение по стилям Показать последующее содержание на новой строке (невозможно через CSS)

В листинге 8-12 показано использование элемента br .

Примечание

Элемент br может быть использован только тогда, когда разрывы строк являются частью контента, как показано в листинге 8-12. Вы не должны использовать элемент br , чтобы создать параграфы или другие группы контента; для этой задачи есть существуют другие элементы, которые я описываю в главах 9 и 10.

       I WANDERED lonely as a cloud
 That floats on high o'er vales and hills,
 When all at once I saw a crowd, A host, of golden daffodils;

На рисунке 8-10 показано, как браузер отображает контент, если используется элемент br .

Указание возможности для безопасного разрыва строки

Элемент wbr является новым в HTML5, и он указывает, где браузер мог бы разумно вставить разрыв строки, если контент больше, чем текущее окно браузера. Браузер сам принимает решение относительно того, актуален ли на данный момент разрыв строки. Элемент wbr просто показывает подходящие места, где можно сделать разрыв строки. В таблице 8-14 представлен элемент wbr .

Элемент wbr
Тип элемента Фразовый
Разрешенные родительские элементы Любой элемент, который может содержать фразовый контент
Локальные атрибуты Нет
Содержание N/A
Стиль тегов Тег пустого элемента (не требует закрывающего тега)
Новый в HTML5 Да
Изменения в HTML5 N/A
Соглашение по стилям Показать последующее содержание на новой строке, если требуется перенос содержания

В листинге 8-13 показано использование элемента wbr для того, чтобы помочь браузеру отобразить длинное слово.

       This is a very long word: Super califragilisticexpialidocious. We can help the browser display long words with the wbr element.

Чтобы понять значение элемента wbr , нужно посмотреть, как браузер работает, если этот элемент используется, и как браузер ведет себя, если этот элемент не используется. На рисунке 8-11 показано, как браузер обрабатывает содержание, если элемента wbr нет.

Без элемента wbr браузер сталкивается с длинным словом и рассматривает его как единое целое. Это означает, что вы в конечном итоге получите большое количество пустого места в конце первой строки текста. Если вы добавите элемент wbr , как показано в листинге 8-13, то вы дадите браузеру больше возможностей, как видно на рисунке 8-12.

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

Что новенького на smarly.net

или RSS канал:

Источник

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

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

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

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

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

Атрибуты

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

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

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

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

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

Примеры

Простой br

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

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

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

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

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

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

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

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

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

BCD tables only load in the browser

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

Found a content problem with this page?

This page was last modified on 5 февр. 2023 г. by MDN contributors.

Your blueprint for a better internet.

MDN

Support

Our communities

Developers

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

Источник

: элемент «Разрыв строки»

Элемент
HTML создает разрыв строки в тексте (возврат каретки). Это полезно для написания стихотворения или обращения, где разделение строк имеет большое значение.

Try it

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

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

Attributes

Атрибуты этого элемента включают глобальные атрибуты .

Deprecated attributes

Указывает,с чего начинать следующую строку после перерыва.

Стиль с CSS

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

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

Examples

Simple br

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

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

Accessibility concerns

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

Используйте элементы

и используйте свойства CSS, такие как margin для управления их интервалом.

Technical summary

Content categories Поток контента , формулируя содержание .
Permitted content Нет, это пустой элемент .
Tag omission Должен иметь начальный тег и не должен иметь конечного тега. В документах XHTML запишите этот элемент как
.
Permitted parents Любой элемент, допускающий фразовое содержание .
Неявная роль ARIA Нет соответствующей роли
Разрешенные роли АРИА none , presentation
DOM interface HTMLBRElement

Источник

Читайте также:  Boolean functions in java
Оцените статью
© 2023 Программирование