Вы здесь: Главная > HTML > Абзацы

Абзацы

Теперь, когда у вас есть базовая структура HTML-документа, вы можете немного поработать с содержимым.

Вернитесь в свой текстовый редактор и добавьте ещё одну строку на свою страницу:

<!DOCTYPE html>
<html>
<head>
    <title>Моя первая страница</title>
</head>
<body>
    Это моя первая страница.
    Супер!
</body>
</html>

Просмотрите документ в своём браузере.

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

Это моя первая страница. Супер!

Это потому, что браузеры обычно не обращают внимания на то, в какой строке находится ваш код. Они также не обращают внимания на пробелы (вы получили бы тот же результат, если бы набрали “Это моя первая страница, супер!”).

Если вы хотите, чтобы текст отображался в разных строках или, скорее, если вы предполагаете, что это будут два разных блока текста (потому что, помните, HTML ─ это значение, а не оформление), вам нужно явно указать это.

Измените ваши две строки содержимого так, чтобы они выглядели следующим образом:

<p>Это моя первая страница.</p>
<p>Супер!</p>

Тег p используется для абзацев.

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

Думайте о содержимом HTML, как если бы это была книга ─ с абзацами там, где это уместно.

Акцент

Вы можете выделить текст в абзаце, используя em (важно) и strong (очень важно).

<p>Реально, <em>это</em> супер! <strong> Предупреждение:</strong> уровень адреналина может привести к тому, что голова взорвётся.</p>

Реально, это супер! Предупреждение: уровень адреналина может привести к тому, что голова взорвётся.

Традиционно браузеры по умолчанию выделяют em курсивом, а strong жирным шрифтом. Это не то же самое, что теги i и b, которые (хотя они были слегка переопределены в HTML5) изначально выделены курсивом и полужирным шрифтом.

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

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

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

Это моя первая страница.<br>
Супер!

В прерывании строк нет содержимого, поэтому нет закрывающего тега.

Может возникнуть соблазн чрезмерно использовать разрывы строк br. Не стоит использовать br, если два блока текста должны быть отделены друг от друга. В этом случае вам нужен тег p.

Страницы в тему:

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