媒体查询-屏幕高度/设备

Question

我已经建立了一个网站，其中包含一个扩展/承包搜索表格与固定的位置。这在桌面上很好--但当然，对于任何不允许所需高度的建议，这都是有问题的。我要用媒体查询身高

@media (min-height: 700px) {
    #quick-search{position:relative;}

}

并将快速搜索内联放置在没有可滚动高度的设备上，以确保可以滚动。

但我的理解是，一些设备OS /浏览器将高度称为文档高度，而不是视口高度，因此上述解决方案不会将QS转换为所有所需场景的内联。我说对了吗？如果是这样的话，谁能提出一个适合所有场景的替代解决方案呢？

Answer 1

只要您有正确的元标记，它就会使用视口进行计算。

<meta name="viewport" content="width=device-width">

若要使用屏幕高度，请向媒体添加screen

@media screen and (min-height: 700px) {
    #quick-search{position:relative;}

}

这里有更详细的解释：meta.html