MIME::Lite 和内联 CSS 图像

Posted

技术标签:

【中文标题】MIME::Lite 和内联 CSS 图像【英文标题】:MIME::Lite and inlined CSS images 【发布时间】:2013-04-15 07:24:15 【问题描述】:

我有以下代码:

#!/root/bin/perl
use strict;
use warnings;
use MIME::Lite;


my $data =<<"DATA";
<!DOCTYPE html PUBLIC >
<html>
<head>
<style>

#header 
  background-image: url("cid:background.png");

</style>


</head>
<body>
<div id="header"></div>
<img src="cid:logo_header.png"></img>
</body>
</html>

DATA

my $msg = MIME::Lite->new(
         To      => 'xxx@xxx.com',
         Subject => 'title',
         Type    => 'text/html',
         Data    => $data
    );
    $msg->attach(
        Type => 'image/png',
        Id   => 'logo_header.png',
        Path => 'logo_header.png',
    );
   $msg->attach( Type => 'image/png',
                 Id   => 'background.png',
                 Path => 'background.png'); 
   $msg->send();

当我将图像放置为背景或&lt;img&gt; 时,它似乎没有在 CSS 中显示图像(这个模块甚至解析非 HTML 标签吗?)它显示得很好。 我什至尝试将background-image: url("cid:background.png"); 变成background-image: url("background.png");,但效果不佳。

有什么想法吗?

【问题讨论】:

【参考方案1】:

我想你会想要CSS::Inliner。专门针对这个问题设计的。

html 电子邮件客户端有很多限制。如果您围绕该主题进行谷歌搜索,您会发现他们都有自己迷人的怪癖。

【讨论】:

即使内联(在 HTML 标签内)的样式它仍然不起作用。尚未检查模块。 如果您发现 HTML 是有效的,但它仍然没有显示在您的查看器中,那么您将不得不 (1) 手动构建您自己的 HTML 消息以查看是否可以找到咒语有效和/或 (2) 找到带有背景图像的有效消息并查看其作用。 你肯定会想要 CSS::Inliner - 我写它就是为了这个原因。

以上是关于MIME::Lite 和内联 CSS 图像的主要内容,如果未能解决你的问题,请参考以下文章

css 内联SVG作为css背景图像

通过 CSS 内联显示图像

CSS 内联图像的精灵

如何使用内联 css 将图像定位在 html 中?

如何将带有css样式的内联SVG从浏览器保存/导出到图像文件

在 CSS 中使用 SVG 图像内联:before 伪元素