Логотип YeaHub

База вопросов

Собеседования

Тренажёр

База ресурсов

Обучение

Навыки

Войти

Выбери, каким будет IT завтра — вместе c нами!

YeaHub — это полностью открытый проект, призванный объединить и улучшить IT-сферу. Наш исходный код доступен для просмотра на GitHub. Дизайн проекта также открыт для ознакомления в Figma.

© 2026 YeaHub

Документы

Медиа

Назад
Вопрос про HTML: doctype, html

Что такое DOCTYPE и зачем он нужен?

Этот вопрос проверяет знание основ HTML и понимание того, как браузер интерпретирует веб-страницы.

Короткий ответ

<!DOCTYPE> — это инструкция для браузера, которая сообщает, в каком режиме он должен обрабатывать HTML-код. Без этого браузер может работать в режиме совместимости (quirks mode), что может привести к неправильному отображению страницы. Современные страницы обычно используют <!DOCTYPE html> для включения стандартного режима, который поддерживает современные веб-технологии.

Пример:

<!DOCTYPE html>
<html>
	<head>
		<title>Пример</title>
	</head>
	<body>
		<h1>Привет, мир!</h1>
	</body>
</html>

Длинный ответ

<!DOCTYPE> — это инструкция для браузера, которая сообщает, какую версию спецификации HTML использовать при обработке страницы. Она не является HTML-тегом и не отображается в интерфейсе страницы.

Веб-страницы могут отображаться по-разному в зависимости от того, включён ли режим стандартов или режим совместимости:

  • Режим стандартов: Браузер рендерит страницу в соответствии с современными стандартами HTML и CSS.

  • Режим совместимости (quirks mode): Браузер имитирует устаревшее поведение для старых веб-страниц.

Почему это важно?

Если декларация <!DOCTYPE> отсутствует, браузеры могут неправильно интерпретировать код страницы, особенно при использовании CSS. Например, размеры блоков и обработка таблиц могут отличаться.

Пример:

Минимальная HTML-страница:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Документ</title>
</head>
<body>
	<h1>Пример страницы</h1>
</body>
</html>

История <!DOCTYPE>

HTML 4.01:
Декларация была более сложной, так как включала ссылки на DTD (Document Type Definition). Пример:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Это указывало браузеру на строгий режим без устаревших элементов.

HTML5:
Упрощённая форма <!DOCTYPE html>, так как HTML5 больше не использует DTD.

Как работает <!DOCTYPE>?

Когда браузер видит декларацию <!DOCTYPE>, он:

  • Переходит в режим стандартов.

  • Интерпретирует HTML и CSS в соответствии с современными спецификациями.

Если <!DOCTYPE> отсутствует, браузер включает режим совместимости, где поддерживается устаревшее поведение. Это может привести к визуальным и функциональным ошибкам.

Практический пример:

Без <!DOCTYPE>:

  • Браузер может интерпретировать ширину блока с width: 100px; как включая отступы (margin) и границы (border).
    С <!DOCTYPE>:

  • Браузер интерпретирует только содержимое блока в соответствии с CSS-бокс-моделью.

<!DOCTYPE> нужен для того, чтобы браузер правильно рендерил страницу в современном режиме стандартов. Это обязательная часть любого HTML-документа, которая задаёт основу для корректного отображения и работы вашего сайта.

Уровень

  • Рейтинг:

    1

  • Сложность:

    2

Навыки

  • HTML

    HTML

Ключевые слова

#doctype

#html

Подпишись на React Developer в телеграм