在頁面中嵌入HTML字符串而不影響頁面的樣式

Question

我有一些CSS的頁面。我有一個字符串形式的HTML代碼塊，我只是在頁面上寫的。

問題是，html字符串包含它自己的CSS，它覆蓋了頁面的CSS。我需要將該CSS僅應用於字符串變量中的html，而不是整個頁面。

我該如何做到這一點？我知道我可以使用Iframe，但它需要「source」屬性。我擁有的HTML不是一個不同的頁面，而只是一個簡單的字符串。

Answer 1

HTML字符串的代碼段可能會有所幫助，但如果我正確理解了您的問題，則無法阻止新的CSS影響整個頁面。但是，如果您可以修改HTML字符串的方式，那麼您只需正確設置樣式。

比方說，你的字符串是一樣的東西

<style type="text/css"> 
    h1 {color:red;} 
    p {color:blue;} 
</style> 
<div>Some HTML inside</div> 

然後，你將不得不相應地更改DIV的類和CSS，如：

<style type="text/css"> 
    .myclass h1 {color:red;} 
    .myclass p {color:blue;} 
</style> 
<div class="myclass">Some HTML inside</div> 

這種方式，新的CSS只會影響新的內容。