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

В HTML вам, в основном, будут попадаться два типа элементов HTML.

Блочные элементы, вроде:

  • абзацы <р>;
  • списки: неупорядоченные (с маркером) <ul> или упорядоченные списки (с числами) <ol>;
  • заголовки: от первого уровня <h1> до шестого уровня <h6>;
  • статьи <article>;
  • разделы <section>;
  • длинные цитаты <blockquote>.

Строчные элементы, вроде:

  • ссылки <a>;
  • выделенные слова <em>;
  • важные слова <strong>;
  • короткие цитаты <q>;
  • аббревиатуры <abbr>.

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

Строчные элементы предназначены, чтобы разграничить часть текста и придать ему определённую функцию или смысл. Строчные элементы, как правило, содержат одно или несколько слов.

<p>Вы уже видели это <a href="http://www.youtube.com">замечательное видео</a> на YouTube?</p>

Открывающие и закрывающие теги

Все блочные элементы содержат открывающие и закрывающие теги.

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

Содержит открывающие и закрывающие теги Самозакрывающие
Блочные элементы <p> </p>
<ul> </ul>
<ol> </ol>		 Невозможно
Строчные элементы <a> </a>
<strong> </strong>
<em> </em>		 <input>
<br>
<img>

Другие типы элементов HTML

Есть несколько исключений у блочных/строчных элементов. Вот те, с которыми вы чаще всего столкнётесь:

  • пункты списка <li>;
  • таблица <table>;
  • строки таблицы <tr>;
  • ячейки таблицы <td>.

Перейти к заданиям

Автор: Джереми Томас
Последнее изменение: 22.01.2025
Сопоставьте элемент и его тип.
Блочный 
Строчный 
Пункт списка 
Ячейка таблицы 
Таблица 
Строка таблицы
<strong><td><ul><tr><table><li>

Сопоставьте элемент с его назначением.
<strong> 
<em> 
<h1> 
<ol> 
<p> 
<section>
Абзац текстаУпорядоченный списокВыделенные словаРазделВажные словаЗаголовок первого уровня

Вопрос 1 из 4

Какое утверждение является правильным?
Строчные элементы придают части текста определённый смысл.
Строчные элементы разбивают весь документ на отдельные строки.
Строчные элементы определяют основную статью и разделы документа.
Строчные элементы задают взаимосвязанные заголовки.

Заполните пустые поля.
<ul>
  Первый</li> 
  Второй</li>
  Третий