5

嗨,我正在尝试学习 CSS,并且一直在查看网站的来源以了解它在实践中的工作原理。前几天偶然发现了960网格系统,发现一个非常漂亮的网站设计是使用960gs框架>> OneHub

在这个阶段,在我对 CSS 有更好的理解之前,我认为使用 CSS 框架对我来说并不是很明智。所以我的问题是关于他们如何在网站上实现居中的内容框,背景填充以扩展到您的浏览器宽度。

我安装了萤火虫,但我不知道为什么他们网站上的 div 如此。#gutter, #navigation 将扩展以填充整个浏览器宽度。我看不到这些 div 是如何计算它们的宽度值的,因为似乎没有一个子元素足够大,或者没有一个规则会迫使这些 div 变大。

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

我希望我的问题是有道理的,并感谢您对此提供的任何帮助

4

3 回答 3

7

无样式的 DIV 将始终填充 100% 的父元素。如果那是主体,或者填充浏览器窗口的其他元素,它将填充 100%。

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

于 2009-06-08T03:28:19.680 回答
2

如果没有为宽度指定规则,则默认宽度为 100%——也就是说,它会扩展以填充其父元素。在这种情况下,父元素是 body,也是视口的全宽。

于 2009-06-08T03:27:47.047 回答
0

对于 960 网格系统,当您说整个浏览器宽度时,您的意思是 960 像素。同意上面的rpflo。

于 2009-08-21T14:00:30.357 回答