清除div及其任何CSS樣式的內容

這可能是一個奇怪的問題，但我試圖做一個div，將作爲一種HTML郵件消息的預覽窗格，我想確保所有樣式是內聯完成的。所以我希望div和它的內容不會從外部頁面獲得樣式。清除div及其任何CSS樣式的內容

有沒有辦法做到這一點（在CSS或JavaScript），或者我必須重寫以前設置的每個單獨的樣式？

我會展示一些代碼，但這有點破壞我想要這個問題。舉例來說，假設我有一個div：

<div id="somediv"> 
    <h2>Message Header</h2> 
    <p>This is some content</p> 
</div>

由於這個div是一個較大的頁面的一部分，它和它的內容如有樣式（如利潤率，填充，字體，字體大小，顏色，等等）從周圍的頁面和任何包含的CSS文件。有沒有辦法否定所有的造型，而不是單獨覆蓋它們？

來源

2013-12-20 tubaguy50035

顯示您的編碼 – Hiral

爲什麼不使用iframe來達到這個目的？它不會繼承任何樣式。 – Pavlo

將來，您將使用all: unset declaration重置所有屬性，但僅適用於Firefox 27+。

現在，你可以把你的「內在」的內容在一個單獨的文件，並通過iframe嵌入它：

<iframe src="content.html"></iframe>

content.html（最低有效HTML5文檔）：

<!doctype html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <title>Content</title> 
    </head> 
    <body> 
    <h2>Message Header</h2> 
    <p>This is some content</p> 
    </body> 
</html>

來源

2013-12-20 17:30:31 Pavlo

如果我想通過javascript設置iframe的html？ – tubaguy50035

@ tubaguy50035'iframe.src ='content.html'，但這超出了這個問題的範圍。 – Pavlo

如果要重寫繼承的CSS並且不使用browser-default-CSS，則可以在每個屬性後面添加!important。例如：

#noInherit { 
    background-color: #fff !important; 
}

我不確定您是否可以停止繼承。也許別人可以給你一個更好的答案。

來源

2013-12-20 17:20:09 Fabic

我不相信你可以刪除所有樣式，因爲沒有這樣的事情在CSS中爲空。你可以把一切都自動是一個自動傾卸大

.noStyle{ 
    width: auto; 
    height: auto; 
    etc... 
}

，但我不認爲會得到你後的效果，因爲它只會讓DIV繼承一切從它的父（S）。關於你想要完成什麼的更多細節可能會更容易幫助你找到一個可行的解決方案，但我不認爲目前提出的問題是「可解決的」。

來源

2013-12-20 17:20:25 lupos

我猜你可以得到的最接近的是在給定的容器內的任何東西上做某種CSS reset，然後可能嘗試重新添加一些類似默認的邊距等，直到它再次看起來「無風格」。然後從你的內聯CSS中取出它。

另一種完全不同的方法可能是在iframe中顯示郵件，其中根本沒有應用樣式。可能可以完成，但可能是一個更復雜的實施。

來源

2013-12-20 17:20:52

您可以使用否定選擇器。只需添加：不在任何CSS規則之前，您不希望應用該div。

http://www.w3.org/TR/css3-selectors/#negation

努力工作，如果你做手工，但如果你覺得你可以自動執行它。請注意，它只適用於現代瀏覽器。

另一種方法是使用iframe。不建議。

來源

2013-12-20 17:32:09 SRachamim

爲什麼iframe是「不可思議的」？ – Pavlo

這可能是iframe的一小部分可接受的用途之一。 – tubaguy50035

由於書籤和導航問題，不建議使用iframe。無論如何，它作爲默認解決方案並不錯。我的規則是：如果可以更改iframe的URL，請勿使用iframe。 – SRachamim

清除div及其任何CSS樣式的內容

回答

相關問題