AVEWEB.RU

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

Блочные теги

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

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

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

Инлайн теги

Инлайн теги (или простым языком их называют «строчными») не подразумевают отступы вовсе. Все дело в том, что элементы, заключенные в такие теги, располагаются не друг под другом, как в предыдущем случае, а последовательно. Это позволяет расположить на одной строке, например, текст и поле для ввода. Переход на следующую строку осуществляется лишь в том случае, если установлен соответствующий тег (
) или элементы дошли до конца строки.

Некоторые нюансы

Блочные теги имеется возможность располагать друг в друге, со строчными тегами такой возможности не имеется.

Начиная с четвертой версии языка html появился ряд элементов, таких как img, select, inputи textarea, которые по своим особенностям относятся именно к инлайн тегам, но тем не менее, разработчик может задать им определенное значение отступов по вертикали. Это было сделано для того, чтобы элементам в этих тегах можно было задать рамку или сцентрировать их по центру строки в отношении к тексту.

В заключении

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