HTML电子邮件签名Outlook 2016中的视网膜图像

时间:2019-01-11 11:55:34

标签: html outlook vml

我正在尝试将公司徽标添加到Outlook中的签名中,但是在iPhone上的用户徽标模糊。我找到了一篇文章,要求使用2x图像作为分辨率,但是在发送之前不能用作Outlook调整尺寸的图像。

文件文件夹中的徽标为268 x 56像素,但是当发送给用户134 x 28像素时,我在chrome开发人员工具中进行了检查。

https://litmus.com/blog/understanding-retina-images-in-html-email

这是图像的html代码。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<HTML xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
<HEAD>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8">
<META NAME="Generator" CONTENT="MS Exchange Server version 6.5.7036.0">
<link rel=File-List href="Standard Signature_files/filelist.xml">
<TITLE>Preview</TITLE>
<!--[if !mso]>
<style>
v\:* {behavior:url(#default#VML);}
o\:* {behavior:url(#default#VML);}
w\:* {behavior:url(#default#VML);}
.shape {behavior:url(#default#VML);}
</style>
<![endif]--><!--[if gte mso 9]><xml>
 <o:OfficeDocumentSettings>
  <o:AllowPNG/>
 </o:OfficeDocumentSettings>
</xml><![endif]-->

</HEAD>
<BODY>
        <!--[if gte vml 1]>
            <v:shapetype id="_x0000_t75" coordsize="21600,21600"
             o:spt="75" o:preferrelative="t" path="m@4@5l@4@11@9@11@9@5xe" filled="f"
             stroked="f">
             <v:stroke joinstyle="miter"/>
             <v:formulas>
              <v:f eqn="if lineDrawn pixelLineWidth 0"/>
              <v:f eqn="sum @0 1 0"/>
              <v:f eqn="sum 0 0 @1"/>
              <v:f eqn="prod @2 1 2"/>
              <v:f eqn="prod @3 21600 pixelWidth"/>
              <v:f eqn="prod @3 21600 pixelHeight"/>
              <v:f eqn="sum @0 0 1"/>
              <v:f eqn="prod @6 1 2"/>
              <v:f eqn="prod @7 21600 pixelWidth"/>
              <v:f eqn="sum @8 21600 0"/>
              <v:f eqn="prod @7 21600 pixelHeight"/>
              <v:f eqn="sum @10 21600 0"/>
             </v:formulas>
             <v:path o:extrusionok="f" gradientshapeok="t" o:connecttype="rect"/>
             <o:lock v:ext="edit" aspectratio="t"/>
            </v:shapetype>

            <v:shape id="_x0000_i1029" type="#_x0000_t75" style='width:134px; height:28px; max-width:134px;'><v:imagedata src="Standard Signature_files/logo.png" o:title="logo" /></v:shape>
        <![endif]-->

        <![if !vml]><img src='Standard Signature_files/logo.png' style='width:134px; height:28px; max-width:134px;' v:shapes='_x0000_i1029'><![endif]>      

</BODY>
</HTML>

1 个答案:

答案 0 :(得分:0)

这适用于所有版本的Outlook。它需要一个1200像素的图像并将其压缩为600像素。 Outlook的关键是添加<img width="600" />,否则它将以全宽显示图像。您可以使用内联样式表来指导现代电子邮件客户端执行其他任务。 Outlook将忽略style="width: 600px; max-width: 600px;"

<img width="600" alt="name" class="em_full_img" border="0" src="http://example.com/sampleimage.jpg" style="display: block; width: 600px; max-width: 600px; border: 0 !important; outline: none !important;" />

该类名只是将@media查询定向到一个小头宽以下以扩展到100%。

祝你好运。