Тег <body> используется для размещения всего содержимого, которое отображается на веб-странице.

Синтаксис тега <body>

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок страницы</title>
  </head>
  <body>
    <h1>Заголовок 1</h1>
    <p>Это параграф.</p>
  </body>
</html>

Спецификация HTML

Тег <body> является частью спецификации HTML Living Standard.

Семантический или нет

Тег <body> считается семантическим, поскольку несёт в себе смысл и точно передаёт назначение своего содержимого.

Примеры использования

Простая веб-страница:

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок страницы</title>
  </head>
  <body>
    <h1>Мой веб-сайт</h1>
    <p>Добро пожаловать на мой веб-сайт!</p>
  </body>
</html> 

Веб-страница со ссылками:

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок страницы</title>
  </head>
  <body>
    <h1>Мой веб-сайт</h1>
    <p>Добро пожаловать на мой веб-сайт!</p>
    <a href="https://example.com">Visit Example.com</a>
  </body>
</html>

Веб-страница с изображениями:

<!DOCTYPE html>
<html>
  <head>
    <title>Заголовок страницы</title>
  </head>
  <body>
    <h1>Мой веб-сайт</h1>
    <p>Добро пожаловать на мой веб-сайт!</p>
    <img src="image.jpg" alt="Image Description" widht="740" height="350">
  </body>
</html>

Для чего использовать тег <body>

  • Для отображения содержимого на веб-странице.
  • Для форматирования текста и другого содержимого с помощью HTML-тегов.
  • Для размещения ссылок на другие веб-страницы или ресурсы.
  • Для вставки мультимедийного содержимого, такого как изображения и видео.
  • Для стилизации содержимого с помощью CSS.
  • Для определения структуры веб-страницы с помощью HTML-тегов.

Атрибуты тега <body>

onbeforeunload — сценарий, который выполнится, когда пользователь соберётся покинуть страницу.

onhashchange — сценарий, который выполнится при изменении URL.

onmessage — сценарий, который выполнится при получении сообщения от приложения.

onoffline — сценарий, который выполнится, когда браузер начнёт работать в автономном режиме.

ononline — сценарий для запуска, когда браузер начинает работать в режиме онлайн.

onpagehide — сценарий, который выполняется, когда пользователь переходит со страницы.

onpageshow — сценарий, который выполняется, когда пользователь переходит на страницу.

onunload — сценарий, который выполняется, когда пользователь покидает страницу.

onafterprint — сценарий, который выполнится после печати веб-страницы.

onbeforeprint — сценарий, который выполнится перед печатью веб-страницы.

onlanguagechange — сценарий, который выполнится при изменении языка документа.

onmessageerror — сценарий, который выполнится при возникновении ошибки в сообщении, полученном с помощью API Messaging.

onpopstate — сценарий, который выполнится при изменении состояния истории браузера.

onrejectionhandled — сценарий, который выполнится при обработке отклоненного обещания в объекте Promise.

onstorage — сценарий, который выполнится при изменении данных в объекте localStorage или sessionStorage.

onunhandledrejection — сценарий, который выполнится при возникновении отклоненного обещания в объекте Promise без обработки.

Глобальные атрибуты

Тег поддерживает все глобальные атрибуты HTML.

Ограничения

Тег <body> должен использоваться только один раз в HTML-документе. Он не может быть вложен внутрь другого тега <body> или любого другого элемента.

Нюансы

  • Если в документе нет тега <body>, браузер всё равно попытается отобразить страницу. Но полученная страница может быть плохо сформирована или в ней будет отсутствовать важное содержимое.
  • Если в HTML-документе несколько тегов <body>, распознаётся только первый из них, а все последующие игнорируются.

Поддержка браузерами

Тег поддерживается всеми современными браузерами.

Актуальная информация — на сaniuse.

Альтернативные теги

Альтернативных тегов для тега <body> не существует.

Чем заменить тег

Прямой замены тегу <body> не существует.

Актуальность

Тег <body> актуален и является обязательным элементом всех HTML-документов.


Хотите узнать больше об HTML-тегах?

Прочитайте справочник по HTML или познакомьтесь с вёрсткой на интерактивных тренажёрах в HTML Academy.


«Доктайп» — журнал о фронтенде. Читайте, слушайте и учитесь с нами.

ТелеграмПодкастБесплатные учебники

Читать дальше

<div>

Синтаксис, примеры использования, основные атрибуты.

  • 25 января 2023

<dl>

Синтаксис, примеры использования, основные атрибуты.

  • 25 января 2023

<option>

Синтаксис, примеры использования, основные атрибуты.

  • 25 января 2023

<ul>

Синтаксис, примеры использования, основные атрибуты.

  • 25 января 2023

<video>

Синтаксис, примеры использования, основные атрибуты.

  • 25 января 2023

<datalist>

Синтаксис, примеры использования, основные атрибуты.

  • 25 января 2023

<caption>

Синтаксис, примеры использования, основные атрибуты.

  • 25 января 2023