为什么我应该在HTML中使用容器div?

我目前正在学习HTML / CSS,并且已经注意到一种常见的技术是将一个通用的容器div放在body标签的根部:

<html> <head> ... </head> <body> <div id="container"> ... </div> </body> </html> 

有没有这样做的正当理由? 为什么不能只是引用身体标签?

容器div,有时是内容div,几乎总是用于更复杂的CSS样式。 身体标签在某些方面是特殊的。 浏览器不把它当作普通的div来对待; 其位置和尺寸与浏览器窗口相关联。

但是一个容器div只是一个div,你可以用margin和border来devise它。 你可以给它一个固定的宽度,并且可以用margin-left: auto; margin-right: auto中心margin-left: auto; margin-right: auto margin-left: auto; margin-right: auto

另外,内容,比如版权声明,可以放在容器的外面,但不能放在身体的外面,允许在边界以外的内容。

这个方法可以让你有更多的样式化你的整个内容的灵活性。 有效地创build两个你可以风格的容器。 HTML的身体标签作为你的背景,并与包含你的内容的容器id的div。

然后,您可以在页面中定位您的内容,同时为背景或其他效果造型,而不会造成任何问题。 将其视为内容的“框架”。

这是前端编码人员最大的坏习惯之一。

上面所有的答案都是错的。 身体确实需要一个宽度,边距,边界等,并应作为您的初始容器。 html元素应该像你想要的那样充当你的背景“canvas”。 在我已经完成的几十个网站中,我只需要使用一次容器div。

我愿意成为使用容器div的这些相同的编程人员也在divs内部乱放div的标记 – 在其他地方。

不要这样做。 精简地使用div,并瞄准精益标记。

– = – = – 更新 – 不知道什么是错误的,因为我可以编辑这个答案从5年前,但我不能回复评论,因为它说我需要50名代表之前,我可以这样做。 因此,我会在这里收到的答复添加我的答案。 – = – = –

我刚刚在回答之后的几年中发现了这一点,并且看到有一些后续回复。 而且,你肯定是在开玩笑?

您为我的域find的安装的占位符网站,我从来没有声称是我的标记或样式,甚至在我的文章中提到,非常清楚的是一个基本的CMS安装,没有一个内容的话(它在主页上说的很多)。 那不是我的标记和造型。 那是Silverstripe默认模板。 我不信任它。 不过,也许是我能想到的仅有的两个例子之一就是需要一个容器格。

示例1:devise用于容纳未知数的通用模板。 在这种情况下,您看到一个默认的CMS模板,其div内部有div。

惊恐的事件。

示例2:三列布局,使页脚正确清除(我认为这可能是我需要一个容器div,很难记住,因为那是几年前的情况。)

我只是build立(甚至还没有完成)我的域的主题,并开始加载内容。 对于这个容易实现的语义标记的例子,点击链接。

http://www.bitbeyond.com

坦率地说,我很困惑,人们认为你实际上需要一个容器div,并从一个开始,甚至只是一个身体。 正如我听到的,曾经由CSS规范的原作者之一解释过的这个身体,被当作“最初的容器”。

标记应该根据需要添加,而不是因为这就是你所看到的方式。

我最常见的原因是:

  1. 布局可以有一个固定的宽度(是的,我知道,我为devise师喜欢固定的宽度做了很多工作)
  2. 所以布局可以通过应用text-align:center到body,然后margin:auto在容器div的左边和右边居中。

某些浏览器(<咳嗽> Internet Explorer)不支持身体上的某些属性,特别是widthmax-width

我知道这是一个古老的问题,但我自己重新devise一个网站面临这个问题。 特洛伊Dalmasso让我思考。 他说得很好。 所以,我开始看我是否可以在没有容器div的情况下工作。

我可以当我设置身体的宽度。 在我的情况960px。

这是我使用的CSS:

 html { text-align:center; } body { margin: 0 auto; width: 960px; } 

这很好地集中了也有固定宽度的内联块。

希望这对任何人都有用。

div标签被用来devise风格的网页,使其看起来在视觉上吸引网站的用户或观众。 在HTML中使用container-div将使网站看起来更加专业和有吸引力,因此更多的人会想要探索你的网页。

好,

容器div是非常好的,因为如果你想要网站为中心,你只是不能用body或html做…但是你可以用div。 为什么容器? 它通常被使用,只是因为代码itselve必须是干净和可读的。 所以这是容器…它包含所有的网站,万一你想搅乱它:)

祝你好运

大部分的浏览器都默认采用网页大小。 所以有时候页面不会在不同的浏览器中显示。 所以,通过使用用户可以改变为特定的HTML元素。 例如,用户可以添加特定HTML标签的边距,大小,宽度,高度等。