Question

我的网站上有一个页面，我正在显示HTML电子邮件。

有些电子邮件似乎附带了CSS，它会覆盖我的网站布局，以至于某些事情会被放错地方...... 例如我在页面顶部有一个工具栏，在一些邮件中覆盖了电子邮件中的各种标题信息。

有没有办法创建一个div，我可以在html电子邮件中放置一个布局，有效地说“留在这个div中，不要跟别人有什么关系”？

值得注意的是我将html内容作为＆＃39; text＆＃39;而不是指外部网站。（它实际上是从API返回，但假设适用相同的限制）

addColumn( columnComponent.createObject ( myTableView, { "role": myRole, "title": someTitle } ) )

给我一个空白的iframe

Answer 1

使用与此类似的IFrame包含您的邮件：

<iframe src="http://www.w3schools.com"></iframe>

这会将样式分开

请参阅http://www.w3schools.com/tags/tag_iframe.asp了解自定义IFrame的选项

如果使用html作为文本（而不是引用现有页面：

%iframe{srcdoc: "#{@mail.html}"} #for rails / haml

或

<iframe srcdoc="<your html as text>"></iframe>

Answer 2

您可以合并范围风格：

<div>
  <style scoped>
    h1 { color: FireBrick;   }
    p  { color: SaddleBrown; }
  </style>
  <h1>This is an H1 in a scoped div. Regardless of global styles the text should be "FireBrick".</h1>
  <p>This is a paragraph in a scoped div. The text should be "SaddleBrown".</p>
</div>

<p>This is another paragraph, that will unaffected by the scoped style and remain black.</p>

值得注意的是：此功能仍处于试验阶段，并未得到2015浏览器的广泛支持，目前只有FireFox v21.0 +支持此功能。（more info @ w3school.com）

参考：https://css-tricks.com/saving-the-day-with-scoped-css/

Answer 3

戴夫的回答

<iframe src="http://www.w3schools.com"></iframe>

适用于引用外部网站或以html格式存在的页面。

如果使用html作为文本（而不是引用现有页面）：

%iframe{srcdoc: "#{@mail.html}"} #for rails / haml

或

<iframe srcdoc="<your html as text>"></iframe>

然后格式化iframe以适应诀窍。

停止导入的html内容覆盖CSS

3 个答案: