responsive-design - 响应式网页设计 : percentages/html5 boilerplate/960gs or Foundation framework?

Question

我有使用以 px 表示的固定尺寸的 HTML5 和 CSS3 构建静态网站的经验。我过去常常手工编写 CSS，这可能是最好的方法(结合使用 SASS 和 Compass，我仍然需要学习)。现在我必须实现一个新网站，并且我正在尝试制作一个灵活的布局，该布局可以很好地显示在桌面和移动设备上任何浏览器大小的任何主要浏览器(Internet Explorer、Firefox、Opera、Safari)上。我现在更关心桌面分辨率，但如果它在移动设备上看起来也不错，那就更好了。

我目前正在阅读 Ethan Marcotte 的《响应式网页设计》一书，并且我正在学习当我必须使用他的公式设置维度时使用百分比:目标/上下文 = 结果(基本上是内容和容器)。我认为这是制作灵活网站的好方法。 Ethan Marcotte 所说的响应式网站应该包含 3 个要素:

灵活的基于网格的布局；

灵活的图像和媒体；

媒体查询。

我认为这是实现它的好方法。

除了该理论和手工制作的 CSS 之外，在不同的浏览器中可能会有不同的元素显示。我已经尝试过我目前正在使用并且我更喜欢的 Css 重置和 Normalize.css。我想尝试集成 Modernizr 的 HTML5 样板。你推荐它吗？

最近有越来越多的网格系统(甚至 Adob​​e Dreamweaver CS6 也使用 respond.js 实现了一种创建流体布局网格的方法。有什么好处吗？)我正在考虑尝试 960 网格系统或 ZURB 的 Foundation。我知道流体布局有不同版本的 960gs，无论如何，Foundation 现在更适合流体布局吗？

最后，是否可以将 HTML5 Boilerplate 与 960gs 或 Foundation 结合起来，这有意义吗？

我已经阅读了与这些主题相关的问题和答案，但通常它们特定于一件事。我想对所有这些事情有一个全局的看法，并就如何继续提出建议。我提前感谢大家。

Answer 1

无论 960gs 提供什么，Bootstrap 和 Foundation 都提供更多。也就是说，Bootstrap 和 Foundation 都已经包含了基于网格的布局以及响应性选项。

也就是说，我建议您仔细查看 Bootstrap 和 Foundation，然后进行自己的比较。选择提供您更喜欢的功能的那个。如果您的工作井井有条，那么两者中的一个就足够了。

既然你还没有尝试过，我建议你现在真的去做，你的问题会在一瞬间消失。我建议你从 Bootstrap 开始，因为当你这样做时，你可能永远不会考虑尝试其余的。