Почему я должен использовать контейнерный div в HTML?

Этот метод позволяет вам более гибко стилизовать весь ваш контент. Эффективное создание двух контейнеров, которые можно стилизовать. Тег HTML Body, который служит вашим фоном, и div с идентификатором контейнера, который содержит ваш контент.

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

Контейнерный div, а иногда и контентный div, почти всегда используются для более сложных стилей CSS. Тег body в некотором роде особенный. Браузеры не рассматривают его как обычный div; его положение и размеры привязаны к окну браузера.

Но контейнерный div - это просто div, и вы можете стилизовать его с помощью полей и границ. Вы можете задать ему фиксированную ширину и центрировать с помощью margin-left: auto; margin-right: auto.

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

Наиболее частые причины для меня таковы:

1. Макет может иметь фиксированную ширину (да, я знаю, я много работаю для дизайнеров, которым нравится фиксированная ширина), и
2. Таким образом, макет можно центрировать, применив text-align: center к телу, а затем margin: auto слева и справа от контейнера div.

Это одна из самых больших вредных привычек, которые совершают фронтенд-программисты.

Все ответы выше меня неверны. Тело принимает ширину, поля, границы и т. д. И должно выступать в качестве исходного контейнера. Элемент html должен действовать как фоновый «холст», как и было задумано. На десятках созданных мной сайтов мне приходилось использовать контейнерный div только один раз.

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

Не делай этого. Экономно используйте div и стремитесь к бережливой разметке.

- = - = - ОБНОВЛЕНИЕ - Не уверен, что не так с SO, потому что я могу отредактировать этот ответ 5 лет назад, но я не могу ответить на комментарии, поскольку в нем говорится, что мне нужно 50 Rep, прежде чем я смогу это сделать. Соответственно, я добавлю свой ответ к полученным здесь ответам. - = - = -

Я только что нашел это, спустя годы после моего ответа, и вижу, что есть некоторые последующие ответы. И вы, конечно, шутите?

Установленный сайт-заполнитель, который вы нашли для моего домена, который, как я никогда не утверждал, был моей разметкой или стилем, и даже не упоминался в моем сообщении, явно был базовой установкой CMS без единого слова контента (это было сказано на домашней странице). Это была не моя разметка и стиль. Это был шаблон Silverstripe по умолчанию. И я не беру в этом заслуги. Однако это, пожалуй, один из двух примеров, которые я могу придумать, для которых потребуется контейнерный div.

Пример 1. Общий шаблон, предназначенный для размещения неизвестных. В этом случае вы видели шаблон CMS по умолчанию, в котором есть блоки внутри блоков внутри блоков.

Ужас.

Пример 2: макет из трех столбцов для правильной очистки нижнего колонтитула (я думаю, что это, вероятно, был сценарий, в котором мне требовался контейнер div, который трудно запомнить, потому что это было много лет назад).

Я только что создал (еще не закончил) тему для своего домена и начал загружать контент. Чтобы увидеть этот легко реализуемый пример семантической разметки, щелкните ссылку.

http://www.bitbeyond.com

Честно говоря, меня сбивает с толку то, что люди думают, что вам действительно нужен контейнерный div, и начинают с него, прежде чем даже пытаться просто использовать тело. Тело, как я слышал, однажды объяснил один из первоначальных авторов спецификации CSS, был задуман как «начальный контейнер».

Разметку следует добавлять по мере необходимости, а не потому, что вы видели это именно так.

Некоторые браузеры (<кашляет> Internet Explorer) не поддерживают определенные свойства тела, особенно width и max-width.

Я знаю, что это старый вопрос, но я сам столкнулся с этой проблемой при изменении дизайна веб-сайта. Трой Далмассо заставил меня задуматься. Он хорошо подметил. Итак, я начал смотреть, смогу ли я заставить его работать без контейнера div.

Я мог, когда установил ширину тела. В моем случае до 960 пикселей.

Это CSS, который я использую:

html {
  text-align:center;
}

body {
  margin: 0 auto;
  width: 960px;
}

Это красиво центрирует встроенные блоки, которые также имеют фиксированную ширину.

Надеюсь, это кому-нибудь пригодится.

Теги div используются для стилизации веб-страницы, чтобы она выглядела визуально привлекательной для пользователей или аудитории веб-сайта. использование container-div в html сделает веб-сайт более профессиональным и привлекательным, и, следовательно, больше людей захотят изучить вашу страницу.

Хорошо,

Контейнер div очень хорошо иметь, потому что, если вы хотите, чтобы сайт был центрирован, вы просто не можете сделать это с помощью body или html ... Но вы можете с помощью div. Почему контейнер? Его обычно используют просто потому, что код должен быть чистым и читабельным. Итак, это контейнер ... Он содержит весь веб-сайт, на случай, если вы захотите с ним возиться :)

Удачи

Большинство браузеров по умолчанию принимают размер веб-страницы. Таким образом, иногда страница не будет отображаться одинаково в другом браузере. Таким образом, с помощью пользователь может изменить конкретный элемент HTML. Например, пользователь может добавить поля, размер, ширину, высоту и т. д. Определенного тега HTML.