Я заметил, что распространенным методом является размещение общего контейнера div в корне тега body:
<html>
<head>
...
</head>
<body>
<div id="container">
...
</div>
</body>
</html>
Есть ли веская причина для этого? Почему CSS не может просто ссылаться на тег body?
Контейнер div, а иногда и контент div, почти всегда используются для более сложного стилизации CSS. Тег тела особым образом. Браузеры не рассматривают его как обычный div; его положение и размеры привязаны к окну браузера.
Но контейнер div - это просто div, и вы можете его стиль с полями и границами. Вы можете дать ему фиксированную ширину, и вы можете центрировать ее с помощью margin-left: auto; margin-right: auto.
Кроме того, контент, например, уведомление об авторских правах, может выходить за пределы контейнера div, но не может выходить за пределы тела, что позволяет использовать контент на внешней стороне границы.
Этот метод позволяет вам иметь больше гибкости при стилизации всего вашего контента. Эффективное создание двух контейнеров, которые вы можете использовать. Тег тега HTML, который служит в качестве фона, и div с идентификатором контейнера, который содержит ваш контент.
Это позволяет вам размещать контент в пределах страницы, одновременно стирая фон или другие эффекты без проблем. Рассматривайте это как "Кадр" для контента.
Самые распространенные причины для меня таковы:
Это одна из самых больших вредных привычек, совершаемых кодонами переднего конца.
Все ответы выше меня неверны. Тело действительно принимает ширину, поля, границы и т.д. И должно действовать как ваш первоначальный контейнер. Элемент html должен действовать как ваш фоновый "холст", как он был предназначен. На десятках сайтов, которые я сделал, мне нужно было только один раз использовать контейнер div.
Я бы хотел быть тем, что те же самые кодеры, использующие контейнеры divs, также засоряют свою разметку div внутри divs - везде.
Не делай этого. Используйте divs экономно и нацелитесь на точную разметку.
- = - = - UPDATE - Не знаю, что неправильно с SO, потому что я могу отредактировать этот ответ с 5 лет назад, но я не могу ответить на комментарии, поскольку он говорит, что мне нужно 50 Rep, прежде чем я смогу это сделать. Соответственно, я добавлю свой ответ на ответы, полученные здесь. - = - = -
Я только что нашел это, спустя годы после моего ответа, и вижу, что есть некоторые последующие ответы. И, конечно же, вы шутите?
Установленный сайт-заполнитель, который вы нашли для моего домена, который я никогда не утверждал, был моей разметкой или стилем или даже упоминался в моем сообщении, был очень четко базовой установкой CMS с одним словом контента (он так же сказал о домашняя страница). Это не моя разметка и стиль. Это был шаблон Silverstripe по умолчанию. И я не беру на себя ответственность за это. Это, однако, возможно, один из двух примеров, о которых я могу думать, что это потребует контейнера div.
Пример 1: общий шаблон, предназначенный для размещения неизвестных. В этом случае вы видите шаблон CMS по умолчанию, в котором есть div внутри div внутри div.
Ужас.
Пример 2: макет из трех столбцов для правильной очистки нижнего колонтитула (я думаю, что это был, вероятно, сценарий, который мне нужен, чтобы контейнерный div был трудно запомнить, потому что это было много лет назад.)
Я только что создал (еще не закончил) тему для своего домена и начал загружать контент. Для этого легко достигнутого примера семантической разметки щелкните ссылку.
Честно говоря, я озадачен тем, что люди думают, что вам действительно нужен контейнер-контейнер, и начинайте с него, прежде чем пытаться просто создать тело. Тело, как я слышал, однажды объяснил один из оригинальных авторов спецификации CSS, предназначалось как "начальный контейнер".
Разметка должна быть добавлена по мере необходимости, а не потому, что это так, как вы ее видели.
Некоторые браузеры (<cough> Internet Explorer) не поддерживают определенные свойства на теле, в частности width и max-width.
Я знаю, что это старый вопрос, но я столкнулся с этой проблемой, переделав веб-сайт. Трой Далмассо заставил меня задуматься. Он делает хороший момент. Итак, я начал видеть, могу ли я заставить его работать без контейнера div.
Я мог бы установить ширину тела. В моем случае до 960px.
Это css, который я использую:
html {
text-align:center;
}
body {
margin: 0 auto;
width: 960px;
}
Это красиво центрирует встроенные блоки, которые также имеют фиксированную ширину.
Надеюсь, это полезно для всех.
div используются для стилизации веб-страницы, чтобы она выглядела визуально привлекательной для пользователей или аудитории веб-сайта. использование контейнера-div в html сделает сайт более профессиональным и привлекательным, и поэтому больше людей захотят изучить вашу страницу.
Ну,
Контейнер div очень хорош, потому что, если вы хотите, чтобы сайт был центрирован, вы просто не можете делать это только с телом или html... Но вы можете, с divs. Почему контейнер? Его обычно используют, только потому, что его код должен быть чистым и читаемым. Так что это контейнер... Он содержит весь сайт, на случай, если вы захотите его обмануть:)
Удачи.
По умолчанию большинство браузеров берут размер веб-страницы. Таким образом, некоторая страница не будет отображаться одинаково в разных браузерах. Таким образом, использование пользователя может измениться для конкретного элемента HTML. Например, пользователь может добавить маркер, размер, ширину и высоту определенного HTML-тега.