0

我已经使用 DIV/CSS 创建了一个布局。我在下面附上了一个示例图像和链接，显示了我希望如何组织事情。在标题中，有一个标志和一个菜单，它们的宽度累计为 1000 像素。功能、内容和页脚部分的宽度也应为 1000 像素。但是，所有部分的实际背景图像都是 100% 的宽度并且水平重复。

下面是我想做的一个例子：

示例布局概念

到目前为止，我实际整理的内容（就设计而言）可以在这里查看：http: //ohachem.com/2/。这就是我想要遵循的。CSS 可以在这里查看：http: //ohachem.com/2/style.css

实现这一目标的最佳方法是什么？如您所见，“特征”部分中的文本并未完全居中对齐。我试过使用 clear:both、overflow:hidden 和其他几种方法，但没有成功。

4

3 回答 3

0

您指向的网站使用了液体布局，这里有很多例子：http ://www.dynamicdrive.com/style/layouts/category/C13/ 。

请注意，在您的示例中，我无法辨别定位属性，使布局响应式的很大一部分是确保它在所有浏览器和屏幕上看起来一致。

于 2013-02-26T17:34:18.967 回答
0

我建议您使用 CSS3 媒体查询而不是脚本来进行响应式/自适应网页设计。

请看看这个

这些不会处理很多，因此重量轻，大多数现代浏览器和设备都支持 CSS3，因此是一个方便可靠的选项。

于 2013-02-26T17:39:04.547 回答
0

“特色”文字的“错位”是由浮动标识引起的。因为浮动尚未清除并延伸到您的标题之外，它导致该文本在它周围流动。添加overflow: hidden到您的#header元素将更正它，但还有其他方法可以在不添加额外标记的情况下清除浮动。

或者，您可以使您的徽标与标题的高度相同。现在 height 属性设置为相同的值，但是徽标有一些额外的填充，这会导致溢出。

于 2013-02-26T18:37:43.660 回答