您建议使用多少媒体查询？
我做了4个设计：
960用于横向模式（ipad和更像桌面） 768用于纵向模式（ipad） 340用于肖像模式（iphone） 以及所有960以上
现在我的问题：
1）首先，我甚至不知道为什么我使用的是960而不是1024.我刚才读过一些东西，因为滚动条你要将宽度减小到960.关于平板电脑和智能手机呢？< / p>
2）我选择了这些宽度因为我认为，如果有人使用横向模式，它会切换到“ipad-media-query”并返回“iphone-media-query”。但这只是我的理论。我是媒体查询的新手。这就是我问的原因。感谢任何帮助甚至建议的CSS代码示例，以便为网站提供最佳的媒体查询量？？
3）我只想覆盖大多数平板电脑，智能手机，台式机等受最佳媒体查询大小的影响。我非常感谢您的“最佳解决方案”！
答案 0 :(得分：6)
一根绳子有多长？
这取决于您和您的设计，有多少媒体查询适合使用以及如何实施它们。
作为指南，我建议看一下Twitter Bootstrap如何实现他们的媒体查询。他们已经对它进行了大量的研究，以得出它们的数字，这将是一个很好的起点。
http://twitter.github.com/bootstrap/scaffolding.html#responsive
答案 1 :(得分：2)
尝试识别断点是个坏主意。响应式网站中断点的主要原因是保持最佳体验。您不希望为每个新设备或分辨率引入新的媒体查询。
答案 2 :(得分：2)
根据需要使用尽可能多的媒体查询。您可能会因为不想要一个巨大的CSS文件而回避使用太多。但这不会显着减慢网站的速度。如果您很好地组织媒体查询并使用每个查询的最小和最大宽度，则可以非常轻松地跟踪您的代码。
如果需要，您可以为每个设备的每个方向使用一个媒体查询。当然，理想情况下，您希望使用零媒体查询，只需创建一个完美变形的完美网站。但除非你的网站非常简单，否则这种情况不会发生。
我使用了9个媒体查询。
如果你可以扩大分辨率参数并摆脱一些媒体查询，那就更好了。
答案 3 :(得分：1)
使用媒体查询： 240 x 320（手机）， 320 x 480（手机）， 480 x 640（小平板电脑）， 768 x 1024（平板电脑 - 肖像）， 1024 x 768（平板电脑 - 风景）
考虑到宽度低于320px是一个非常好的做法，但对于那些关注每个访客的人来说都很好。
答案 4 :(得分：0)
我会使用不需要媒体查询的动态布局。
只需使用媒体查询来隐藏/移动元素。
你可以使用任意数量的。只需在页面中放置一些javascript，显示当前的浏览器宽度，然后调整浏览器大小以测试何时隐藏元素。适合我
答案 5 :(得分：0)
最新的设计世界需要响应式设计。
参见此示例＆amp;使用您想要的所有媒体查询：http://nmsdvid.com/snippets/