Загрузка...

Block и inline в HTML

После таблиц посмотрите на поток страницы: у каждого элемента есть привычка display по умолчанию. Две семьи: block и inline.

Что значит поток здесь

Порядок упаковки по умолчанию без layout-CSS. Абзац — block; ссылка остаётся inline в предложении.

Прямой ответ

Block: p, div, заголовки, списки, table. Inline: a, strong, em, span, code. Сначала запомните defaults.

📊 Common defaults

Category	Examples	Flow habit
Block	p, div, h1–h6, ul, ol, section, table	New line, full available width (typical)
Inline	a, strong, em, span, code	Continues inside the text line

Block-коробки с inline внутри

p — контейнер; a/strong в строке. Следующий div открывает новый блок.

Block paragraph with inline pieces

html

HTML Code

<p>
Read the <a href="guide.html">guide</a> and note the
<strong>important</strong> words before you continue.
</p>
<div>This div is a separate block box on its own line.</div>

Разбор примера абзаца

p владеет коробкой
a и strong в строке
div ниже — другой block

`div` против `span`

div по умолчанию block; span — inline. Короткие фразы → span.

div versus span contrast

html

HTML Code

<p>Price: <span class="note">includes tax</span> today only.</p>
<div class="note">This whole note sits on its own block line.</div>

Разбор div/span

span в строке
div на своей block-строке

CSS позже может сменить display

Учите defaults, чтобы видеть overrides.

Практика

Два p стопкой
Две a в одном абзаце
Сравните span и div
strong без принудительной новой строки
Запишите по три тега каждой категории

Частые ошибки

div для каждой мини-фразы
ждать новую строку от strong
забывать CSS override

Кратко

Block ≈ новая строка
Inline ≈ в строке
span для коротких хуков
CSS потом

🧠 Проверьте Свои Знания

Готов к Началу

Проверьте Свои Знания

Бросьте себе вызов с помощью этой интерактивной викторины и узнайте, насколько хорошо вы понимаете тему

❓

Вопросы

🎯

70%

Для Прохождения

♾️

∞

Время

🔄

∞

Попытки

📝 Инструкции

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

Язык