如何使用媒體查詢覆蓋聚合物中定義的屬性

假設我們已經聲明瞭一個名爲height =「」的屬性，它具有一定的值，比如說200px。我想知道是否有一種方法，我們可以在CSS中使用媒體查詢覆蓋此屬性？據我所知，內聯屬性具有比CSS樣式更高的優先級。如何使用媒體查詢覆蓋聚合物中定義的屬性

這是這種情況的示例代碼：

@media (max-width:480px){ 

     custom-element{ 
      height: 50px; 
     } 
}

<body> 
<custom-element height="200px"> 
</custom-element> 
</body>

預先感謝您。

2016-11-17 Soheil

使用!important將給予外部樣式優先級，並且可以針對與風格標籤特別像這樣的div：

custom-element[style] { 
    height:50px !important; 
}

這是很好的避免使用!important儘可能，但它的一個很少有方法可以重寫內聯樣式。

2016-11-17 23:34:39 Jason

是的，我們可以使用它，但它會使重要的風格素，整個查詢，它不能使用一個特定的斷點。 – Soheil

這個詭計，瘋狂的作品，加上一個花花公子 – Soheil

你感到困惑的屬性和內嵌樣式。 CSS愉快地覆蓋了內聯height屬性。

CSS

img { 
    height: 100px; 
    width: 100px; 
    background-color:red; 
}

HTML

<!-- Height is 100px --> 
<img height="200px"> 
<!-- Height is 200px --> 
<img style="height: 200px">

2016-11-17 23:34:52

這個高度屬性只適用於像img這樣的預定義元素，它與聚合物元素的屬性 – Soheil

無關。在那種情況下，'！important'標誌可能是你最好的選擇。 –

回答