Outlook 忽略宽度属性或 css 属性

Question

我看到很多问题都提到了这个问题，但是 none 已经足够具体来帮助我了。因此，如果我简化它并再次询问，我希望它不会冒犯任何人。希望之泉永恒！

当 Outlook 呈现电子邮件时，控制嵌入在电子邮件中的图像的宽度真的不可能吗？ IE。控制 html 代码为

的图像的宽度

 <img src="cid:seal">

即当 html 代码需要嵌入图像而不是存储在其他地方的图像时。

[注意："seal" 是我在创建带有嵌入图像的 MimeBodyPart 时分配的内容 ID。

详情：我使用 Javamail 应用程序发送多部分电子邮件。正文部分是一个 html 文件。另一个 MimeBodyPart 带有 html 文档中使用的图像。我已将 html 测试简化为两列 table，左列用于图像，右列用于文本。

在 OUTLOOK 中打开时，我尝试过的绝对没有任何东西能够控制图像的大小。

图像始终是我认为必须是图像的某个原始尺寸...太大...所以它强制第一个单元格宽度超过 15%。或者，如果我给单元格一个固定宽度，图像会溢出框，即被剪裁。

我把去掉所有字体样式颜色等的基本代码放在下面。

我已经尝试了在 img 标签上使用宽度属性和 css 样式属性的所有组合。我已经将图像包裹在另一个 table 中......或者将它包裹在主 table 单元格内的 div 块中......甚至将它包裹在 div块在父 table 单元格内的 table 单元格内。我试过以固定像素和百分比指定宽度。

如果我们都能确定这对 Outlook 来说是不可能的，那就太好了。

或者如果可能的话，发布可以运行的示例代码。 [让电子邮件立即打开其图像非常有吸引力，而不是依赖 reader 下载它们。]

注意：当我之后从外部源加载图像时，我似乎能够控制宽度，即谢谢你的帮助。

<html>
  <head>
    <meta name="viewport" content="width=980, initial-scale=1">
    <title>Test Email</title>
  </head>
  <body style="width:100%; border:0;margin:0;padding:0;">
    <table align="center" 
           style="width:980px; border-collapse:collapse;
                  margin-left:auto; margin-right:auto;">
      <tr  style="border:0; margin:0; padding:0;">
        <td style="width:15%; border:0; margin:0; padding:0;">
          <img src="cid:seal" 
               style="width:6em; height:auto;">
         </td>
         <td    style="width:85%; margin:0; padding:.5em 0em 0em 0em; border:0;">
           Some Titles and stuff
         </td>
       </tr>
  <tr>
    <td colspan="2" style="border:0; margin:0; padding:1em 1em 0em .5em;">
      <p> 1st paragraph
      ....
      <p> last paragraph
    </td>
  </tr>
</table>

Answer 1

Outlook 使用 Word 作为电子邮件编辑器。以下系列文章提供了与受支持和不受支持的 HTML 元素、属性和级联样式表属性相关的参考文档：

您可以在Word中设计页面，然后将生成的文档另存为网页。因此，您会找到需要使用的 HTML 标记。

Answer 2

在上面 Eugene 的帮助下，我发现了至少一个好的解决方案。

<img src="cid:seal" width="300"  or "300px"  of "15%"> DOES NOT WORK.

但是当我放弃引号时，它起作用了

<img src="cid:seal" width=300 height=300>

这当然意味着以 % 设置宽度仍然是一个问题，因为它需要引号。

但我会尽我所能。电子邮件现在打开时带有徽标，用户无需下载图片。 AND ... 这个 css 主体选择器也可以使用嵌入图像渲染背景。 [我存储了 Content ID 为 "bkg" 的背景图片。]

AGAIN ... 与使用引号的 img 属性 src="cid:id" 不同，url() 需要 id w/o 引号。

<body style="background-image:url(cid:bkg);
             background-repeat:repeat; 
             width:100%;
             generic-family:Sans-serif;
             font-family:Verdana;
             border:0;margin:1em 0 1em 0;padding:0;">

Outlook 忽略宽度属性或 css 属性

Outlook Ignores Width attribute or css property

outlook

jakarta-mail