3.6 KiB
| title | localeTitle |
|---|---|
| Block and Inline Elements | Блок и встроенные элементы |
Блок и встроенные элементы
Поясним их, используя приведенные ниже примеры:
Образец кода с выходом:
Элемент уровня блока:
Элемент Block-level занимает все пространство родительского (контейнера), например <div> и <p> в примере.
Обратите внимание, что оба <div> и <p> начинаются с новой строки каждый раз, образуя блочно-подобную структуру. Элементы уровня блока начинаются на новых строках.
Общими элементами уровня блока являются <div> , <p> , <article> , <section> , <figure> , <footer> и т. Д.
Встроенный элемент:
Inline, поскольку название говорит, «включено как часть основного текста, а не как отдельный раздел». Внутренние элементы занимают пространство по мере необходимости в пространстве, определяемом основным элементом. В отличие от элементов уровня блока, они не начинаются на новых строках.
Некоторые из встроенных элементов : <a> , <span> , <img> , <code> , <cite> , <button> , <input> и т. Д.
Образец кода с выходом:
Примечание . Элементы уровня блока могут содержать другие элементы уровня блока или встроенные элементы. Встроенные элементы не могут содержать элементы уровня блока.
Изменения в HTML5
Хотя понимание блоков и встроенных элементов по-прежнему актуально, вы должны знать, что эти термины были определены в предыдущих версиях спецификации HTML. В HTML5 более сложный набор «категорий контента» заменяет блок-уровень и встроенные элементы. Элементы уровня блока в основном помещаются в категорию «содержимое потока» в HTML5, а встроенные элементы соответствуют категории «фразирования контента». Дополнительные сведения о новых категориях контента в HTML5, включая содержимое потока и содержание фраз, см. На странице «Категории контента» в Mozilla Developer Network.
Дополнительная информация:
Пожалуйста, обращайтесь к Mozilla Docs