媒体查询高度页面css

Question

@媒体屏幕和(最小宽度: 799px)和(最大宽度: 800px) {}

我有一个网站，它的分辨率是800x600和另一个800x400。宽度始终相同，但高度不同。怎样才能使页面的高度在一个页面中为600，在另一个页面中为400？

Answer 1

您可以在媒体查询中使用max-height来使网站响应高度

1对不同的规则使用逗号

@media screen and (max-width: 995px), 
   screen and (max-height: 700px) {
   ...
}

2.使用和

@media screen and (max-width: 995px)and (max-height: 700px) {
   ...
}

Answer 2

您可以使用此代码指定不同的高度

@media (min-height: 400px) and (max-height: 600px) and (min-width: 799px) and (max-width: 800px) { ... }