覆蓋CSS標記以取消當前標記

對於我必須維護的網站，我需要添加一些CSS。不幸的是，我的公司和建立該網站的公司之間存在一些法律問題。這意味着我無法訪問服務器上的文件。不過，我有一個內置的選項來添加自定義的CSS，並將其內聯加載到標題中。覆蓋CSS標記以取消當前標記

當前CSS主題文件具有這一行：

@media (min-width: 769px) 
.account-page .address-item:nth-child(3n+1), .account-page .order-item:nth-child(3n+1), .account-page .request-item:nth-child(3n+1) { 
    margin-left: 0; 
    clear: both; 
}

這需要從第（3n + 1）至（2N + 1）改變。所以我試圖重新編寫CSS並將其放入自定義CSS字段中。

.account-page .address-item:nth-child(2n+1) { 
margin-left: 0; 
clear: both; 
}

這很好，但不會取消掉其他CSS。上面的代碼給出的樣式在第1和第2項（這很好）上有效，但是（感謝主題文件中的原始代碼）它在第4項上也是有效的。

我嘗試添加：

.account-page .address-item:nth-child(3n+1) { 

}

但它不會做任何事情。其他項目中沒有提到原始CSS中提及的項目（margin-left和clear），所以我不知道給它們提供什麼價值。

有沒有人知道如何在不編輯原始CSS主題文件的情況下完全取消第一個CSS代碼？

來源

2017-09-13 Vinnie Van Rooij

就特異性而言，只有這樣才能覆蓋這個並且總是「贏」的方法是使用內聯樣式（但不要這樣做）。看到; https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity。它也可能取決於CSS文件的加載順序。如果你的CSS文件在主題文件後加載，那麼你應該能夠覆蓋樣式。 – zik

您首先必須像過去一樣覆蓋'3n + 1'選擇器的樣式，然後添加'2n + 1'。你只需用'3n + 1'選擇器添加一個空白塊。這不會覆蓋樣式。您需要包含'clear：none;'和'margin-left：[原始邊距值] px;'。 – OptimusCrime

感謝回覆的傢伙。下面的答案似乎適用於我的情況，即使在跨瀏覽器中，我現在也可以得到期望的結果。 –

如果要覆蓋你的CSS，在不改變當前值，複製的選擇和設定值設置爲默認這樣

.account-page .address-item:nth-child(3n+1) { 
margin-left: auto; 
clear: none; 
}

這個選擇應該是在第一位的，如果仍然沒有嘗試這個

.account-page .address-item:nth-child(3n+1) { 
margin-left: auto!important; 
clear: none!important; 
}

來源

2017-09-13 13:35:47

這是錯誤的！他不希望'2n + 1'被過度糾纏！ – Moher

我使用了這段代碼，並將（3n + 1）更改爲（2n + 1），它似乎優先考慮了2n + 1樣式。在控制檯中，我仍然可以看到原始代碼，但它已被刪除，似乎被忽略。在幾個瀏覽器中試用這個結果也是一樣的。因此，這種方法似乎適用於我。感謝Marko。 –

沒問題，我很高興這對你有幫助。乾杯! –

你應該這樣做：

.account-page .address-item:nth-child(3n+1) { 
    margin-left: auto!important; 
    clear: none!important; 
}

它添加到FIL結束e

來源

2017-09-13 13:40:12 Moher

感謝您的解決方案，它與上面的類似，而且這似乎爲我工作。感謝你的回答。 –

爲了讓您的值覆蓋原始數據，您需要將像下面的代碼片段那樣重要的值添加到值的末尾。！重要的規則是一種讓你的CSS級聯的方法，但也有你覺得最重要的規則總是被應用。無論規則出現在CSS文檔中的哪個位置，都會應用具有！important屬性的規則。

.account-page .address-item:nth-child(3n+1) { 
    margin-left: auto !important; 
    clear: none !important; 
}

來源

2017-09-13 14:23:16

覆蓋CSS標記以​​取消當前標記

回答

相關問題

覆蓋CSS標記以取消當前標記