: Атрибут background | htmlbook.ru

Какие теги могут быть в Body. Список атрибутов тега

19217 4

How-to – Читать 6 минут

Прочитать позже

АУДИТ САЙТА — КОНТЕНТ

Инструкцию одобрил
Руководитель SEO отдела в Mnogoland

Юрий Горбатый

Тег body — важный элемент, который содержит весь контент, отображаемый на веб-странице в браузере. Его необходимо правильно заполнять, чтобы страница корректно выглядела и успешно ранжировалась в поисковых системах.

Что такое тег body

Тег body — неотъемлемая часть любой HTML-страницы, необходимая для обозначения границ основного содержимого, которое показывается пользователям. Упрощенно HTML-страница имеет следующую структуру:

  • head — блок заголовков, содержащий техническую информацию, скрипты и метатеги, которые браузер не показывает пользователям в стандартном режиме просмотра. Исключение — метатег <title>, который определяет заголовок страницы;
  • body — все содержимое страницы, доступное пользователям.

В HTML-документе должен быть только один тег <body>. Для успешного продвижения страницы в него необходимо добавлять качественный и уникальный контент, интересный пользователям. При этом важно следить, чтобы он не дублировал полностью либо частично содержимое других страниц как собственного проекта, так и других сайтов. В теге body нет ключевых слов или фраз.

Где находится тег body

Увидеть HTML-теги на web-странице можно, кликнув правой кнопкой мыши и нажав «Просмотр кода страницы»:

В начале страницы размещен открывающийся тег <head>:

Открывающийся тег <body> следует сразу после закрывающегося </head>, завершающего блок заголовков:

Для чего нужен тег body

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

Также в теге могут размещаться js-скрипты, выполняющие различные функции. Код при этом размещается внутри тегов <script></script>. В HTML5 тип скрипта дополнительно прописывать не нужно, так как по умолчанию это JavaScript. В устаревших версиях HTML js-скрипты прописывались так:

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

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

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

Применение ряда атрибутов тега <body>, например, rightmargin и leftmargin, осуждается спецификацией HTML и станет причиной не валидного кода. Некоторые атрибуты можно использовать с переходным типом <!DOCTYPE>

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

При использовании атрибутов в теге body можно сразу посмотреть, как страница будет выглядеть при внесении изменений. Для этого в Google Chrome нужно кликнуть правой кнопкой мыши по странице и выбрать «Просмотреть код», после этого браузер будет отображаться в режиме разработчика.

Примеры использования атрибутов тега <body>

  • В данном примере использован атрибут bgcolor, определяющий фоновый цвет страницы. С его помощью исходный цвет фона страницы был изменен на черный:

Цвет можно указать с помощью шестнадцатеричных кодов либо названий, которые предусмотрены в стандарте HTML;

  • изменение цвета текста страницы с помощью атрибута text:
  • изменение фонового изображения с использованием атрибута background:

Путь к файлу можно использовать как в относительном, так и в абсолютном виде. Относительный путь предпочтительнее, так как обеспечивает менее длинные ссылки, а также избавляет от проблем при смене домена. В этом случае все ссылки останутся рабочими, в отличие от варианта с абсолютным адресом, при котором после изменения домена гиперссылки станут битыми.

Можно ли добавлять метатеги в body

Метатеги, например, <robots>, <description> должны помещаться в раздел заголовков документа — head. Метатеги предназначены для служебной информации о документе, которая не демонстрируется в теле документа.

Попытки использовать какой-либо метатег в body делают код недействительным с точки зрения спецификации HTML и могут нарушить разметку документа.

В некоторых случаях при ошибочных размещениях метатегов в теле страницы возможен их автоматический перенос браузером в раздел head и корректное отображение документа. Однако желательно создавать валидную разметку и добавлять метатеги только в раздел заголовков, а не в основное содержимое страницы.

Заключение

Тег <body> — необязательный элемент в спецификации HTML5, однако его использование на веб-страницах удобно для разграничения служебной информации и контента сайта. Также он полезен для создания стилей страницы в CSS-файле.

Наполнять тег <body> стоит уникальным контентом, который будет представлять интерес для пользователей и в полной мере соответствовать запросам целевой аудитории.

В данном теге может содержаться информация в разнообразных видах и формах: текст, мультимедийный контент и скрипты, делающие страницу интерактивной.

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

Не стоит размещать метатеги в <body> поскольку это нарушает правила спецификации HTML.

» title = «Что должно присутствовать в теге Body 16261788249403» />

Аудит всего сайта или отдельной страницы в один клик. Полный список ошибок, отсортированный по критичности, пути их устранения и рекомендации. Любая периодичность проверки и автоматическая рассылка отчетов на почту.

Запустить аудит сайта

Сэкономьте время на изучении Serpstat

Хотите получить персональную демонстрацию сервиса, тестовый период или эффективные кейсы использования Serpstat?

Оставьте заявку и мы свяжемся с вами 😉

Оцените статью по 5-бальной шкале

3. 55 из 5 на основе 11 оценок

Нашли ошибку? Выделите её и нажмите Ctrl + Enter, чтобы сообщить нам.

Рекомендуемые статьи

How-to

Denys Kondak

Как модерировать комментарии на сайте, чтобы избежать фильтров поисковиков

How-to

Denys Kondak

Как создать страницу ошибок 5XX

How-to

Denys Kondak

Как реализовать выбор языка и переключение языковых версий на сайте

Кейсы, лайфхаки, исследования и полезные статьи

Не успеваешь следить за новостями? Не беда! Наш любимый редактор подберет материалы, которые точно помогут в работе. Только полезные статьи, реальные кейсы и новости Serpstat раз в неделю. Присоединяйся к уютному комьюнити 🙂

Нажимая кнопку, ты соглашаешься с нашей политикой конфиденциальности.

Поделитесь статьей с вашими друзьями

Вы уверены?

Спасибо, мы сохранили ваши новые настройки рассылок.

Сообщить об ошибке

Отменить

Тег body

HTML5CSS.ru

ЛУЧШИЙ САЙТ ДЛЯ РАЗРАБОТЧИКОВ

❮Назад
Полный HTML Ссылки
Дальше ❯

Пример

Простой HTML-документ с минимальным количеством требуемых тегов:

<html>
<head>
<title>Название документа</title>
</head>

<body>
Содержание документа……
</body>

</html>

Определение и использование

Тег <body> определяет тело документа.

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

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

Элемент
<body>ДаДаДаДаДа

Различия между HTML 4,01 и HTML5

Все атрибуты макета удаляются в HTML5.

Атрибуты

АтрибутЗначениеОписание
alinkcolorНе поддерживается в HTML5.
Задает цвет активной ссылки в документе
backgroundURLНе поддерживается в HTML5.
Задает фоновое изображение для документа
bgcolorcolorНе поддерживается в HTML5.
Задает цвет фона документа
linkcolorНе поддерживается в HTML5.
Задает цвет непосещаемых ссылок в документе
textcolorНе поддерживается в HTML5.
Задает цвет текста в документе
vlinkcolorНе поддерживается в HTML5.
Определяет цвет посещенных ссылок в документе

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

Тег <body> также поддерживает Глобальные атрибуты в HTML.

Атрибуты события

Тег <body> также поддерживает Атрибуты событий в HTML.

Похожие страницы

HTML Учебник: HTML Элементы

HTML DOM Ссылки: Body Объекта

HTML DOM Ссылки: document.body Свойство

Параметры CSS по умолчанию

В большинстве обозревателей элемент <body> будет отображаться со следующими значениями по умолчанию:

Пример

body {
    display: block;
    margin: 8px;
}

body:focus {
    outline: none;
}

❮Назад
Полный HTML Ссылки
Дальше ❯

Популярное

html картинка
как вставить картинку в html
цвет текста фона
размер текста html
цвет размер шрифта html
формы html
список html
таблица html
как сделать ссылку в html
html элементы

Copyright 2018-2020 HTML5CSS.ru

Правила и Условия Политика конфиденциальности
О нас
Контакты

Освойте самый важный HTML-элемент прямо сейчас »

В тегах HTML

Раскрытие информации: Ваша поддержка помогает сайту работать! Мы зарабатываем комиссионные за некоторые услуги, которые мы рекомендуем на этой странице. Узнать больше

Элемент из
Структура HTML-документа до и после HTML5 — вот что изменилось
Что делает тег HTML Body: Master The Most Important HTML Element Now ?
Элемент содержит все содержимое веб-страницы. Это должен быть второй элемент внутри родительского элемента, следующий только за элементом.
Дисплей
Блок
Использование
Структурный

Содержание

  • 1 Пример кода
  • 2 Самый важный… и самый простой
    • 2.1 Стилинг
    • 2.2.
    • 3 Поддержка браузером тела
    • 4 Атрибуты тела

    Пример кода 

        . . .

    Самый важный… и самый простой

    Элемент может быть самым важным элементом HTML. Содержимое элемента — это то, что на самом деле отображается пользователю, посещающему вашу веб-страницу или просматривающему ваш документ. И тем не менее, это очень просто. должен быть прямым дочерним элементом , он должен быть после (если присутствует, что не обязательно), там может быть только один из них, и… все.

    Стилизация

    В предыдущих версиях HTML (и в некоторых проприетарных схемах разметки браузера) для был доступен ряд атрибутов стилизации. Все они устарели в HTML5. Любые стили, которые вы хотите применить к , должны быть помещены в ваш CSS. И, на самом деле, — это отличное место для размещения всего CSS, который должен влиять на отображение документа в целом: такие вещи, как шрифты и типографика, цвета текста и фона и другие стили «по умолчанию».

     body { семейство шрифтов: "Adobe Garamond Premier Pro", Garamond, "Linux Libertine", Baskerville, Georgia, serif; вес шрифта: нормальный: размер шрифта: 18 пикселей; цвет: #111111; цвет фона: #fefefe; набивка: 1em; ширина: 95vw; максимальная ширина: 950 пикселей; поле: 0 авто; }

    Ориентация на

    В системах управления контентом общепринятой практикой является размещение списка CSS-классов, специфичных для контента, в элементе . Это позволяет дизайнерам и разработчикам JavaScript выбирать страницы на основе определенных атрибутов контента, таких как категория, теги или тип контента.

    Эти классы программно добавляются различными компонентами и плагинами и предоставляют разработчикам простой способ нацеливания стиля или функциональности на строго определенные наборы страниц (и если они никогда не используются, они не вызывают никаких проблем). проблемы).

    Адам Вуд

    Адам — технический писатель, специализирующийся на документации и руководствах для разработчиков.

    Опора браузера для корпуса

    All All All All All All

    Attributes of body

    Attribute name Values ​​ Notes
    bgcolor Используется для установки цвета фона документа. Устарело. Вместо этого используйте CSS.
    фон Используется для установки цвета фона и изображения для документа. Устарело. Вместо этого используйте CSS.
    текст Используется для оформления текста внутри тела документа. Устарело. Используйте CSS.
    bgproperties Используется для оформления фона документа. Устарело. Вместо этого используйте CSS.
    верхнее поле Используется для установки поля над основной частью документа. Устарело. Используйте CSS.
    onLoad Запускает сценарий после завершения загрузки страницы.
    onUnload Запускает скрипт, когда посетитель покидает страницу.
    onFocus Запускает сценарий, когда посетитель фокусируется на текущей странице.
    stylesrc Был собственным атрибутом системы Frontpage. Не используй.
    scroll Используется для переключения отображения полос прокрутки на странице, отключая возможность прокрутки пользователя. Устарело. Для этого можно использовать CSS, но не стоит этого делать, потому что это плохая идея.

    Тег HTML

    ❮ Пред.

    Следующий ❯

    Тег определяет содержимое веб-страницы (текст, изображения, ссылки и т. д.). Он помещается внутри элемента после элемента. В документе HTML мы можем использовать только один тег.

    Обычно список классов CSS, специфичных для контента, помещается в элемент, что позволяет разработчикам и дизайнерам JavaScript легко ориентироваться на страницы. Даже если эти классы не используются, они не вызовут никаких проблем.

    Тег идет парами. Содержимое записывается между открывающим () и закрывающим () тегами.

    Пример тега HTML

    :

     

  <голова>
    Название документа
  
  <тело>
    
    Содержание документа

    Попробуй сам »

    Результат

    Пример тега HTML

    , используемого со свойствами CSS color и line-height:

     

  <голова>
    Название документа
    <стиль>
      тело {
        цвет: #444444;
        высота строки: 1,5;
      }
    
  
  <тело>
    
    Пример HTML-тега body
    
    
    Lorem ipsum, или lipsum, как его иногда называют, – это фиктивный текст, используемый при макетировании печатных, графических или веб-дизайнов.  Отрывок приписывается неизвестному наборщику в 15 веке, который, как полагают, перепутал части книги Цицерона «De Finibus Bonorum et Malorum» для использования в книге образцов шрифтов.

    Попробуй сам »

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

    Как оформить тег

    ?

    Общие свойства для изменения визуального веса/выделения/размера текста в теге

    :

    • Свойство CSS font-style устанавливает стиль шрифта. нормальный | курсив | наклонный | начальная | наследовать.
    • Свойство CSS font-family задает приоритетный список из одного или нескольких имен семейств шрифтов и/или общих имен семейств для выбранного элемента.
    • Свойство CSS font-size устанавливает размер шрифта.
    • Свойство CSS font-weight определяет, должен ли шрифт быть полужирным или толстым.
    • Свойство CSS text-transform управляет регистром и регистром текста.
    • Свойство CSS text-decoration определяет украшение, добавляемое к тексту, и является сокращенным свойством для text-decoration-line, text-decoration-color, text-decoration-style.