从页面的其余部分隔离元素中的CSS

我在页面中显示HTML电子邮件，并且通常会附带我需要从主页面中分离出的一般样式信息。举例来说，如果电子邮件看起来是这样的：从页面的其余部分隔离元素中的CSS

<style type="text/css"> 
body { background-color:#000; } 
</style> 
<div> 
    email's content here 
<div>

我结束了整个页面在黑色背景上。

我试过iframe，但我需要内容的高度是动态的（我不知道每个电子邮件有多大，直到它呈现），这似乎只能用javascript做。这是一个选择，但它似乎相当黑客。有没有一个标准的，干净的方式来做到这一点？

来源

2010-10-15 smurthas

如果您的约束条件允许，您可以在自己的iframe中显示每封电子邮件。

来源

2010-10-15 20:51:14 Emmett

把唯一的类或ID上包含div和使用，作为所有样式的选择：

<style type="text/css"> 
    div#emailcontent { ... } 
</style> 

<div id="emailcontent"> 
    ... 
</div>

这是一个有点痛，但是这限制样式只有一部分的唯一途径的页面。

来源

2010-10-15 18:44:22

你的意思是把电子邮件中的所有css都包含在一个大选择器中？这是有效的CSS？它似乎不适合我。类似#wrapper {＃email_id1 {color：＃000;}＃email_id2 {color：#FFF;}}？ – smurthas 2010-10-15 18:56:55

不，你必须编写'#wrapper＃email_id1 {...}'，'＃wrapper＃email_id2 {...}'等等。嵌套的CSS会很方便，所以当然不会发生。 W3C不是很有用。 – 2010-10-15 19:25:13

啊，这就是我所怀疑的。在这种情况下，感觉就像一个使用javscript调整大小的iframe可能是更好的选择。 – smurthas 2010-10-15 19:28:27

对于HTML邮件，我会建议使用内联CSS。有时候，独特的课程或ID不适用于其他电子邮件客户端。并且不要在电子邮件中使用Java脚本，在电子邮件营销中使用javascript是不可接受的。请使用内联代码对每个标签进行硬编码，以便与跨电子邮件客户端兼容。

p标签应该转换为span标签;在跨浏览器中，p标记会给出一些填充和余量。如果您想使用，p标签适用于整段的段落。请确保您在每个标记中定义内嵌代码，例如：

< span class =“headlines”style =“font-family：Arial，Helvetica，sans-serif; font-size：13px; font-weight：normal; color ：＃03588c; line-height：18px;“> foo </span>

保证金和填充不应该用于css编码的HTML。这在跨电子邮件客户端不起作用。

来源

2010-10-15 20:30:22

从页面的其余部分隔离元素中的CSS

回答

相关问题