爲什麼兒童選擇器>不適用於sass中的媒體查詢？

Question

假設在一個情況下，我需要的孩子選擇在CSS中，所以我會用SCSS做得一樣：

#bslider { 
    > img { 
      display: block; 
     } 
    > #slide { 
     .carousel-inner { 
      perspective: 1000; 
     } 

    } 
} 

所以>孩子selecter工程SCSS不錯。但現在考慮，如果我需要媒體查詢過，所以我會做它：

#bslider { 
    > img { 
      display: block; 
     } 
    > @media only screen { 
     .carousel-inner { 
      perspective: 1000; 
     } 

    } 
} 

但它給因媒體查詢錯誤。爲什麼我在@media規則之前不能使用>？

建議我在使用id，class或tag之前使用>作爲選擇器。但是，我不得不將它添加到所有的選擇是他們的任何方式來達致這：

#bslider { 

    > img { 
     display: block; 
    } 
     @media only screen > { 
     .carousel-inner { 
      perspective: 1000; 
     } 
     .img { 
      display: inline; 
     } 

     .img2 { 
      display: inline-block; 
     } 


    } 
} 

Answer 1

#bslider { 
    > img { 
     display: block; 
    } 
    @media only screen { 
     > .carousel-inner { 
      perspective: 1000; 
     } 
    } 
} 

爲什麼你不能使用>media之前是>是選擇的一部分原因，而media不是一個選擇，但對於其樣式取決於格式/分辨率顯示的條件等

編輯：

你可以有其他選擇包住媒體查詢，只是不要忘了將它添加在你的HTML。

#bslider { 
    > img { 
     display: block; 
    } 
    > .myContainer{ 
     @media only screen { 
      .carousel-inner { 
       perspective: 1000; 
      } 
     } 
     } 
    }