搞了很久没弄好了,找到这篇神贴,终于解决了问题,亲身测试通过。
gmail 邮件中css无效style无效background image背景图片无效不显示的解决办法
几乎每个会员制网站都需要通过后台发送邮件来与会员进行沟通,如注册确认、营销推广。这些由站方发给会员的信件,往往纯
文本格式已不能满足界面和交互的要 求,这时候我们就需要发送HTML页面。由于HTML邮件不是独立的HOST在本站的页面,是寄人篱下的。所以编写HTML邮件与编写HTML页面有很大 的不同。因为,各面向网民的主流邮箱都或多或少的会对它们接收到的HTML邮件在后台进行过滤。毫无疑问,JS代码是被严格过滤掉的,包括所有的事件监听 属性,如onclick、onmouseover,这是基于邮件安全性的考虑。不仅如此,CSS代码也会被部分过滤。本人要讲的就是如何编写不被各大主流 邮箱过滤的,能正常显示的HTML邮件。
gmail会自动过滤掉 head里的<style>设置的css,所以必须要把css写在html里面。
例如 <div style=”font-size:14px;”>
另外,gmail不支持在css里定义background里的image,包括background:url(”…”)和background-image:url(“..”)
解决办法是 在div的外面加上一层 <table>和<td>
并在<td>里加上background属性,例如
<table>
<tr>
<td background=”http://www.vivizu.com/test.jpg”>
<div>test</div>
</td>
</tr>
</table>
分享到:
相关推荐
范本包括2个示例: -在模板内的元素上使用渐变-身体背景渐变兼容性模板使用CSS background-image线性渐变以及Outlook的VML后备功能,这意味着它可以在所有电子邮件客户端的87%以上使用(可能甚至更多,Mac的许多...
测试邮件在多个主流邮箱服务(如Gmail、Hotmail、163、Sohu和Sina)中的显示效果,并进行必要的调整,是确保邮件质量的关键步骤。通过遵循这些技巧,可以提高HTML邮件在不同环境下的可读性和吸引力,从而提升邮件...
4. **背景颜色和图像**:使用`background-color`属性设置背景色,但不要依赖`background-image`,因为许多邮件客户端会忽略它。 5. **媒体查询**:虽然有限,但可以使用媒体查询(`@media`)进行简单的响应式设计,...
-修正Panel图标不能显示的BUG(CSS中class名不能有$字符)。 +去除PageLayout控件,此控件可以使用BorderLayout和指定PageManager的AutoSizePanelID属性来代替。 -这样所有需要占据全屏的Panel(不管你是Accordion...
-修正Panel图标不能显示的BUG(CSS中class名不能有$字符)。 +去除PageLayout控件,此控件可以使用BorderLayout和指定PageManager的AutoSizePanelID属性来代替。 -这样所有需要占据全屏的Panel(不管你是Accordion...
它旨在解决HTML在电子邮件中呈现不一致的问题,提供了一种简洁、可维护的语法来创建响应式邮件模板。MJML的主要目标是简化开发过程,确保你的邮件在各种邮件客户端上都能有良好的显示效果。 MJML的核心理念是抽象...
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAOEAAADh...'); } `); ``` ##### 4.13 添加CSS样式 使用`GM_addStyle`函数为页面添加CSS样式: ```javascript GM_addStyle(` .myClass ...
CSS属性包括颜色(color)、字体(font-family)、大小(font-size)、布局(如margin和padding)、边框(border)、背景(background-color或background-image)等。通过这些属性,我们可以调整元素的位置、颜色、...
7. **图标和图像**:使用`background-image`或`<img>`标签添加Google标志和其他图标。需要注意的是,优化图像大小以提高页面加载速度。 通过完成这个项目,开发者不仅能够巩固HTML和CSS的基础知识,还能锻炼到实际...