gpt4 book ai didi

css - 带有 html5 标题标签的 960 网格

转载 作者:行者123 更新时间:2023-11-28 18:29:52 26 4
gpt4 key购买 nike

我是 960.gs 的新手,在使用它和 html5 时遇到了一些问题。

我正在尝试以下操作:图像应跨越 2 个网格单元,在同一行中,div 应跨越 5 个单元,然后(因为该“行”已满)应遵循换行符和标题应该显示。我尝试了以下方式:

<div class="container_12">
<header class="grid_12">
<img src="nothing" class="grid_2 alpha"><div class="grid_5 suffix_5">SOMETHING</div>
<h1 class="grid_2 omega">title</h1>
</header>
</div>

根据我对 960.gs 的理解,这应该会产生预期的效果。实际上并没有:它在一行中显示图像,在下一行显示 div 和标题,并在下一行稍微缩进。这是因为使用了除 div 之外的其他元素吗?

提前感谢您的帮助! (我从 http://www.webdesignerdepot.com/2010/03/fight-div-itis-and-class-itis-with-the-960-grid-system/ 得到了很多信息)

最佳答案

<div class="container_12">
<header>
<div class="grid_9">
<div class="grid_2 alpha">
<img src="http://showbuzz.ru/wp-content/uploads/2009/09/dead_earners_9_wenn1642245.jpg" class="grid_2 alpha" />
</div>
<div class="grid_7 omega">
SOMETHING
</div>
<div class="grid_9 alpha omega">
<h1>title</h1>
</div>
</div>
</header>

http://jsfiddle.net/TMAk7/

它对你有用吗?

关于css - 带有 html5 标题标签的 960 网格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14656642/

26 4 0