Блочные и встроенные элементы в CSS.

Давайте продолжим изучение CSS, и рассмотрим, что такое блочные и встроенные элементы в CSS.

Давайте посмотрим нашу индексную страницу. И давайте воспользуемся инструментом контуры - показать элементы уровня блока. Мы видим с Вами выделенные блоки. Это те теги которые есть блочными.

Давайте рассмотрим, чем отличается блочный элемент в CSS от встроенного элемента в CSS.

Блочный элемент всегда идет с новой строки независимо от того куда мы его поместили.
Давайте для примера внутри абзаца выделим слово тегом div. Что это нам даст. У нас произойдет разрыв строки.
Если мы воспользуемся элементом контуры то мы это сейчас и увидим.
Это говорит про то, что блочный элемент всегда идет с новой строки и разрывает строку, если мы его помещаем внутрь блочного элемента.