Question

我正在寻找在元素上设置特定样式的最佳方法，但我只希望在屏幕尺寸小于屏幕高度时应用它。到目前为止，我正在这样做

@media (max-width: 320px) and (max-height : 480px) {
}
@media (max-width: 360px) and (max-height : 640px) {  
}
@media (max-width: 768px) and (max-height : 1024px) {
}
@media (max-width: 800px) and (max-height : 1280px) {
}
@media (max-width: 980px) and (max-height : 1280px) {
}

有一种更简单的方法可以做到这一点还是这是唯一的方法？谢谢。

Answer 1

这是最好的方法之一，但你可以试试jquery。

Answer 2

两种方法：

1. JavaScript：

if(window.innerHeight > window.innerWidth){
    portrait = true;
}else{
   portrait = false;
}

2。 CSS：

 @media screen and (orientation:portrait) { … }
 @media screen and (orientation:landscape) { … }

在CSS中的这两个中，根据height>width或width>height

选择您想要的任何一个

仅当屏幕尺寸小于屏幕高度时如何设置样式？

2 个答案: