网站使用960.gs什么css规则负责div填充100％的屏幕宽度

Question

您好我正在尝试学习CSS，并一直在寻找网站的来源，以了解它在实践中的运作方式。前几天我遇到了960网格系统，发现了一个非常漂亮的网站设计，使用了960gs框架＆gt;＆gt;的 OneHub

在这个阶段，我不认为在我更好地理解CSS之前使用CSS框架是非常明智的。所以我的问题是关于他们如何在网站上实现一个集中的内容框，其背景填充以扩展到您的浏览器宽度。

我安装了firebug，我无法弄清楚为什么他们网站上的div例如。 #gutter，＃navig将扩展以填充整个浏览器宽度。我没有看到这些div如何计算它们的宽度值，因为似乎没有任何子元素足够大或者有一个规则会强制这些div变大。

我不明白宽度是如何100％，我本来期望看到一些边距自动规则或宽度100％指定在CSS的某处但我找不到它。其他使用960gs的网站可能会做同样的事情，但我只是使用这个网站作为参考，因为我认为它有一个很好的设计。

我希望我的问题有道理，谢谢你对此的任何帮助

Answer 1

无风格的DIV将始终填充100％的父元素。如果这是填充浏览器窗口的正文或其他元素，则会填充100％。

它被称为“块级”元素。所有块级元素都以这种方式运行：div，p，form，ul等。

Answer 2

如果没有为宽度指定规则，则宽度默认为100％ - 也就是说，它会扩展以填充其父元素。在这种情况下，父元素是主体，也是视口的整个宽度。

Answer 3

对于960网格系统，当你说整个浏览器宽度时，你的意思是960px。同意上面的rpflo。