Каждый документ, будь то статья, инструкция или просто описание к картинке, обязательно содержит текст. Чтобы его было легко и комфортно читать, мы делим информацию на смысловые блоки - абзацы. Они разделяются переносами строк, пустыми строками или отступами, создавая визуальный ритм и помогая глазу не запутаться в потоке информации.
В мире HTML для создания таких блоков используется тег p (сокращение от английского слова paragraph, что переводится как «абзац»). Здесь кроется маленькая, но приятная деталь: браузер автоматически добавляет вертикальные отступы до и после этого тега. Это удобно, так как элементы сами по себе разделяются в пространстве, не сливаясь в сплошную стену текста. Конечно, размер этих отступов можно легко настроить с помощью стилей CSS, а для разрыва строки внутри одного абзаца существует специальный тег.
Важно понимать природу этого элемента: тег p относится к блочным. Это значит, что при отображении он будет уверенно занимать всю доступную ширину контейнера, а его высота будет динамически подстраиваться под объем содержимого.
Примечание: Обратите внимание на интересный нюанс работы браузера: все лишние пробелы между открывающим тегом p и началом текста, а также перед закрывающим тегом /p, будут просто проигнорированы. Из-за этого «классическая» красная строка не получится, если просто напечатать несколько пробелов в начале абзаца - браузер их "съест". Но не переживайте! С этой задачей блестяще справляется CSS, который позволяет не только задать красивый отступ для первой строки, но и точно контролировать его размер.
Атрибуты Тег p поддерживает стандартные глобальные атрибуты HTML.
Пример <p>Этот текст находится в абзаце.</p> <p>Это второй абзац на странице.</p> <p>А это третий абзац.</p>