手機媒體查詢衝突

Question

我在我的外部CSS使用這些媒體查詢：

/* Wide Mobile Layout: 480px. 
    Gutters: 24px. 
    Outer margins: 22px. 
    Inherits styles from: Default Layout, Mobile Layout. */ 

@media only screen and (min-width: 480px) and (max-width: 767px) 

/* Mobile Layout: 320px. 
    Gutters: 24px. 
    Outer margins: 34px. 
    Inherits styles from: Default Layout. 
    --------------------------------------------- 
    cols 1  2  3 px  68 160 252 */ 

@media only screen and (max-width: 767px) 

時我會改變最大寬度：767px與媒體查詢（最小寬度：480像素）和（最大寬度：767px）寬度變化也是你會幫我解決這個問題

Answer 1

這是因爲CSS中的「C」（級聯）。

上面指定的規則適用於介於480px - > 767px之間的內容，但在其下方指定的規則適用於767px以下的任何內容。

任何在你的第二個媒體查詢將覆蓋如果屏幕低於480像素您的第一個媒體查詢指定與例外屬性。