媒体查询中的两个最大宽度

Question

我看到有人在代码中使用它，并想知道这将如何工作。我已经看到了最小宽度和最大宽度，但从来没有这样。这是否意味着只有在宽度小于460像素的情况下运行，使768像素最大宽度参数不相关？

@media (max-width: 768px) and (max-width: 460px) { 
CSS goes here 
} 

Answer 1

这不是一件特别的事情，它会占用最小的最大宽度

https://jsfiddle.net/

.dog { 
 
    background: green; 
 
    height: 200px; 
 
    width: 200px 
 
} 
 

 
.width { 
 
    height: 30px; 
 
    background: blue; 
 
    width: 460px; 
 
} 
 
@media (max-width: 460px) and (max-width: 768px) { 
 

 
    .dog { 
 
    background: red; 
 
    } 
 

 
}

<div class="width" width="460px"> 
 

 
</div> 
 
<div class="dog"> 
 

 
</div>