如何为一块html代码禁用基础或引导样式?

前端之家收集整理的这篇文章主要介绍了如何为一块html代码禁用基础或引导样式?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我使用mailgun(虽然这个问题与mailgun无关)来解析传入的电子邮件,而mailgun会将解析后的电子邮件发送到我的服务器.
当我收到帖子时,我收到了多部分电子邮件HTML代码.
我想向我的用户显示html电子邮件,我正在使用rails,所以它就像
<div>
  <%= raw(message.body_html) %>
</div>

但是,它看起来与我在yahoo或hotmail中查看相同的电子邮件时的情况有所不同(我知道不同的电子邮件客户端会以不同的方式显示html电子邮件,但我看起来截然不同).

以下是我自建客户端的外观:

这就是雅虎在同一封电子邮件中的样子:

我使用Zurb Foundation作为我的样式框架.但是,我认为电子邮件html带有自己的内嵌样式,我看看它看起来像它的代码,然后它应该看起来与其他客户端相似.

那么显示html电子邮件的最佳做法是什么,假设您获得了一块HTML代码并希望按原样显示它而不让其他框架覆盖其样式?

此外,是否可以禁用基础(或针对此问题的Twitter引导程序)样式代码,例如类似的东西

<div>
  <% disable_foundation_styling begin %>
    <%= raw(message.body_html) %>
  <% end %>
</div>

当然“disable_foundation_styling”只是我的想象力.

提前致谢!

!!!!!!!!! 2013年1月1日更新!!!!!!!!!!!!!!!

正如@Alex L.建议的那样,我试过但它没有像预期的那样安静地工作.
iframe像以前一样呈现视图中的所有内容(见下图),这是可以理解的,因为iframe内容只是另一个控制器的视图,在这种情况下rails也包含所有应用程序布局模板.但是,工具栏不是我最关心的问题,它在iframe中的内容与以前完全一样.

我怀疑iframe可能不是这样做的.我看看gmail和yahoo的代码,他们不使用iframe.相反,他们使用非常深的嵌套来呈现html电子邮件.除了yahoo为每个DOM元素插入自己的id之外,html电子邮件的部分都有相同的代码用于yahoo和gmail.

所以现在我怀疑有一些基础样式会影响它的外观.

一旦我发现更多,我会更新.

解决方法

据我所知,不可能指示浏览器在DOM的子集中有选择地忽略页面的CSS.您必须显式覆盖页面的现有样式.

但是,如果您有iframe元素,则该框架的内容将独立于应用于包含页面的任何样式进行呈现.因此,您可以创建一个单独的控制器和视图,仅用于呈现消息的内容,并将其用作iframe的源.

猜你在找的HTML相关文章