设计这个的最佳方法是什么？浮动还是有更好的方法？附图片[关闭]答案

【问题标题】：What is the best way to design this? Floats or is there a better way? Picture attached [closed]设计这个的最佳方法是什么？浮动还是有更好的方法？附图片[关闭]
【发布时间】：2012-04-17 14:30:56
【问题描述】：

很抱歉图像的粗糙度，但每个框都将位于我网站的一个 div 中。我希望它具有响应性，因此可以在不同的屏幕尺寸上正常工作，所以我知道在定义每个 div 的宽度时我必须使用 % ，但是使用浮动是正确的方法吗？有没有比浮动 div 更简单的方法？我也不确定这是否会奏效。

【问题讨论】：

对不起，我没有说清楚，我只是想知道如何实现图像中的内容

标签： html css frameworks

【解决方案1】：

为此，我会使用更多的 div：

你最大的 div 会向左浮动；然后用蓝色勾勒出的两个（我的补充）也向左浮动。在这些蓝色 div 中，添加您自己的两个或三个 div，没有浮动。这是我所知道的让这个布局工作的最简单的方法。为获得最佳效果，请将所有样式保存在样式表中，以改进缓存和维护工作。

【讨论】：

我明白了，我现在就试试。谢谢。

【解决方案2】：

您不一定需要使用使用百分比分配宽度的浮动 div 进行设计。相反，您可以为希望支持的各种类型的平台设计一个 CSS 类，然后使用 CSS 媒体查询来切换它们。这就是 Twitter Bootstrap 等现代框架完成这项任务的方式。

例如：http://twitter.github.com/bootstrap/scaffolding.html#responsive

【讨论】：