什么是设计这个最好的方法？漂浮还是有更好的方法？附图附件

Question

抱歉图像粗糙，但每个盒子都会放在我的网站上。我希望它能够响应，以便在不同的屏幕尺寸上很好地工作，所以我知道在定义每个div的宽度时我将不得不使用％，但是使用的是正确的方式吗？有没有更简单的方法来做到这一点，而不仅仅是浮动divs？而且我不确定这是否也可以。

Answer 1

要做到这一点，我会用几个div的：

你最大的div将浮左;那么蓝色的两个（我的补充），也漂浮在左边。在这些蓝色div的内部，添加您自己的两个或三个div，而不是浮动。这是我知道让布局工作的最简单的方法。为了获得最佳效果，请将所有样式放在样式表中以改进缓存和维护工作。

Answer 2

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

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