css - 如何接收和显示带有样式表的 HTML 电子邮件?

标签 css email sanitization

在开发基于 Web 的电子邮件系统时,是否有一种普遍接受的正确方法来处理传入电子邮件的样式表?我指的是 <style标签。不是指 @import<link符号。

这些样式表必须仅限于包含外国电子邮件的元素,否则它们也会调整您自己系统的内容,这是一个很大的禁忌。

我知道我应该清理脚本和样式表,这将使我能够防止 url背景图像,或将覆盖我的部分系统的固定位置元素。

我不想完全放弃样式表,所以我看到了这些选项

  • 将样式表转换为内联样式

  • 将整个外国电子邮件放在自己的带有 ID 的 div 中,并将样式规则更改为仅影响该 div(例如 a,b{color:purple} 将变为 #foreign a,#foreign b{color:purple})

这些都是好主意吗?我缺少明显/更好的方法吗?什么是常见的/公认的/稳健的?

最佳答案

电子邮件不支持外部样式表,因此 html 电子邮件中的所有 CSS 都在页面样式标记中,或内联。因为像 gmail 和 yahoo 这样的客户端标准是去除样式标签,以及 body 标签之外的所有其他东西,你可以简单地做同样的事情。将传入电子邮件限制为内联样式将使所有 CSS 保持在这些元素的本地。内联 css 几乎是电子邮件设计 101,因此您不必担心您的电子邮件系统低于标准。

除此之外,Web 客户端还会去除许多 CSS 元素。不希望有人添加 position:fixed; 例如,因为它会突破查看 Pane 。关于每个客户端允许的 CSS 的最佳引用是 Campaign Monitor's CSS guide .

关于css - 如何接收和显示带有样式表的 HTML 电子邮件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17864684/

相关文章:

Jquery 切换类值未被下一个 Jquery 函数选中

email - 阻止本地主机出现在电子邮件标题中

php - 样式联系表会产生一封电子邮件

php - 清理 URL 变量的简洁方法?

ios - iPhone 6 Flexbox 包装问题

css - WPF UnifromGrid :How to style selected Child with rounded corners like in Explorer

html - 我如何摆脱CSS上无用的滚动空间

ios - 在 Swift 中发送应用程序电子邮件

javascript - 使用 javascript 剥离标签并处理换行符

php - 注册页面上的 mysql_real_escape_string