【发布时间】：2015-11-26 13:20:46
【问题描述】：
我正在构建一个响应式网站，并将其设计为适合桌面视图。
我目前正在针对响应式断点/媒体查询对其进行调整。
以下是我希望得到指导的问题：
据我了解，我看到人们只使用宽度作为断点。在这种情况下，我做了同样的事情，让它在所有宽度断点上看起来都很好。
不过，我碰巧正在使用 google chrome 开发者工具进行测试，并开始选择特定设备（iphone 5、iphone 6、iphone 6 plus、ipad 等）
并注意到一些令人担忧的事情，那就是元素在顶部和底部被垂直推离屏幕，因为这些设备中的每一个不仅具有不同的宽度，而且还有高度。
所以我的完美主义者正在考虑为每个主要设备设置高度和宽度的媒体查询，但我意识到这项工作虽然可以完成，但可能不是最有效的，我还没有看到其他教程这样做。
我的具体问题是：是否有更有效的方法来开发响应式网站，而不会让元素垂直离开屏幕。
添加信息：我有一个 div，其中包含一个 img，然后是一个 h1，然后是一个带有 col-sm-6 的引导行
img 宽度以 px 为单位（我尝试了 vh/vw 和 %，但这似乎使它在缩放时更难以控制）
【问题讨论】：
-
a72，这个问题已经在这里回答了..stackoverflow.com/questions/11404744/…
-
阅读这个问题和答案，你会找到你正在寻找的解决方案。
-
@leothelion Leo，感谢您的评论，但我的问题不是“你能做到这一点”。我的问题是“我应该这样做”。仅仅因为我可以做某事，并不意味着我应该这样做。
-
m 使用多年以来的引导和媒体查询，并没有发现任何问题，就像您在不同的手机中所说的那样？如果您将媒体查询设置为宽度，那么如果您不使用任何固定高度或者它仅取决于条件，它将控制高度。如果您将提供工作演示，我们可以在其中进行更多讨论，这将更容易解释。谢谢
标签： css media-queries