如何從元素中刪除所有繼承和計算的樣式？

該頁面有如下CSS：如何從元素中刪除所有繼承和計算的樣式？

input[type=text] 
{ 
    display: inline; padding: 7px; background-color: #f6f6f6; font-size: 12px; letter-spacing: 1px; border: 1px solid #aac7d1; 
    /* lots of other styles here... */ 
}

我有很多的文字輸入元素和以下內容：

<input type="text" id="txt1" />

我嘗試不同的風格適用於通過jQuery這個人文本框（txt1中）：

$('#txt1').removeClass().removeAttr('style').css({ 
    'background-color': '#ff0000', 
    //lots of other styles here... 
});

但是這些來自樣式表的樣式不能通過這種方式從元素中移除。 css規則input[type=text]不是自定義類，所以removeClass()在這裏不起作用，如果我是對的。

我想要做的是;完全刪除應用於元素txt1的所有樣式。除了獲取所有計算樣式的列表並將其設置爲空之外，是否有某種方法可以執行此操作？

來源

2011-11-20 Onur Yıldırım

是否有某種方式來做到這一點

有沒有辦法阻止申請，如果選擇匹配的元素規則。

您可以

設定你想有一個特定的值（用適當的具體選擇和!important
移動元素到不同的文件（這樣可裝載每一個屬性，例如，一個iframe）。
刪除的規則（並因此導致它不適用於任何元件）
變化對規則集的選擇器（因此它不匹配元素的任何更多，Y OU必須要小心，以確保它仍然選擇你所關心的不是讓所有的計算樣式列表和設置他們的空元素）

其他？

這是行不通的。大多數屬性不會接受空白值，因此規則將無效並被忽略（從而導致先前的規則再次應用）。

來源

2011-11-20 01:14:40 Quentin

我認爲你是對的。我可以在循環內重置所有計算的樣式，但它不太合乎邏輯。 –

正如你可以在這個鏈接看到：，所有的選擇器具有特異性值。所以，如果你寫這樣的css規則：#txt1 {}，你可以重置所有不必要的值。

來源

2011-11-20 00:51:24

謝謝，但沒有工作.. –

我認爲我們需要澄清這種情況。所以，如果你有這樣的規則：'input [type = text] {background-color：＃f6f6f6; }'並且想要爲你的項目重載背景顏色，你應該使用規則'＃txt1 {background-color：＃ff0000; }' –

如何從元素中刪除所有繼承和計算的樣式？

回答

相關問題