css中的媒體查詢

Question

如何僅爲1024px寬度寫媒體查詢？

這裏是我的，我已經爲320px的寬度和更

@media (min-width: 320px) { 

} 

什麼是隻有1,024像素寬度的方法編寫的現有CSS？

Answer 1

我相信你想這樣的：

@media (min-width: 320px) and (max-width: 1023px) { 
    /* styles for width > 320px but < 1023px */ 
} 


@media (min-width: 1024px) { 
/* styles for width > 1024px only */ 
} 

這樣你就不必重寫任何樣式。

否則，你可以這樣做：

@media (min-width: 320px) { 
    /* styles for width > 320px - applied to width > 1024px too */ 
} 


@media (min-width: 1024px) { 
/* styles for width > 1024px only */ 
} 

是在needeed時，你將不得不重寫你的第一個媒體查詢樣式的方式不同，在第二個

Answer 2

這樣寫：

@media (max-width:1024px) { 
body{..} 

} 

入住這http://jsfiddle.net/YhsSK/

Answer 3

我THI NK如果你只是要1024，不1023或更小，或1025或更多，你可以做

@media (width: 1024px) { 
    .... 
} 

最小/最大前綴是可選的。 See the w3 entry on it。