Skip to main content

Создание разрывов строк и абзацев с помощью тегов P & BR

GoToWeb - Видеокурс Html и Css, Урок 4, Html теги для работы с текстом - p, h1-h6, b, strong, i, em (Июнь 2026)

GoToWeb - Видеокурс Html и Css, Урок 4, Html теги для работы с текстом - p, h1-h6, b, strong, i, em (Июнь 2026)
Anonim

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

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

Правильное использование элемента абзаца HTML

Элемент абзаца

используется как пара тегов с

тег, открывающий элемент, и

тег закрывает его. При написании HTML4 или HTML5 конечный тег технически не требуется, но рекомендуется закрыть этот тег. В XHTML закрытие

необходимо.

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

Сейчас настало время для всех хороших людей прийти на помощь своей стране. Быстрая коричневая лиса перепрыгнула через ленивую спящую собаку.

Между тегами абзаца открытия и закрытия могут появляться многие другие теги.

Правильное использование элемента разрыва строки HTML

Элемент разрыва строки
tag - тег singleton - у него нет конечного тега. В XHTML вы должны использовать тег с последней косой чертой (
), но в HTML (включая HTML5) это не требуется.

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

Вот пример разрыва строки внутри абзаца:

Сейчас настало время для всех хороших людей прийти на помощь своей стране.
Быстрая коричневая лиса перепрыгнула через ленивую спящую собаку.

Поскольку тег разрыва строки является тегом singleton, в нем не могут использоваться другие теги.

Общие недомогания

а также
Теги

Люди, новые для кодирования, совершают некоторые распространенные ошибки с элементами абзаца и разрыва строки при маркировке веб-страницы.

  • С помощью
    изменить длину текстовой строки
    : Использование тега break в попытке заставить текст появляться или ломаться определенным образом, гарантирует, что ваши страницы выглядят великолепно в вашем браузере, но не обязательно в другом браузере и, конечно же, не на всех устройствах. Если ваш сайт является отзывчивым сайтом, он меняет свой макет на основе разных размеров экрана. Браузер автоматически переносит перенос слов, а затем, когда дело доходит до
    тег, он снова обматывает текст, в результате появляются короткие строки и длинные строки и прерывистый текст. Вы должны использовать таблицы стилей CSS, чтобы диктовать визуальные стили, а не пытаться форсировать макет, добавляя определенные HTML-элементы.
  • С помощьюдобавить пространство между элементами: Еще раз, это обращение к HTML для создания визуального макета, в данном случае интервала, вместо использования CSS. Это распространенная практика некоторых редакторов HTML, и хотя это не является технически неправильным, это приводит к неудобному HTML-образам и может ввести в заблуждение позднее. Он также не соответствует веб-стандартам и разделяет структуру и стиль. В некоторых случаях использование неразрывных пробелов внутри пустых тегов абзаца может привести к неожиданному расстоянию в разных браузерах, поскольку все они интерпретируют это по-разному. Лучшим решением для достижения элементов интервала, необходимых в вашем дизайне, является использование таблиц стилей.

Подробнее об этих и других тегах читайте в этом списке тегов HTML.