Question

我有一个仅限Safari的问题，只有当设备宽度为平板电脑或更低时才出现＆＃34; max-width：1024px＆＃34;。是否可以将媒体查询嵌套在另一个媒体查询中？

@media screen and (max-width:1024px){
     @media screen and (-webkit-min-device-pixel-ratio:0)
     { 
        /* Safari and Chrome */
        ul#squareImgUL{
            bottom: 10px;
        } 

        /* Safari only override */
        ::i-block-chrome,ul#squareImgUL{
            bottom: 0px !important;
        } 
    }
}

Answer 1

不幸的是，你不能将它们配对起来也很好

@media screen and (max-width:1024px) and (-webkit-min-device-pixel-ratio:0){

}

Answer 2

不幸的是，您无法嵌套媒体查询，但可以使用和运算符

@media screen and (max-width:1024px) and 
    (-webkit-min-device-pixel-ratio:0) {
...

您可以在其他媒体查询中嵌套媒体查询吗？

2 个答案: