magento 有关Outlook邮件临时文件中CSS的问题

sh7euo9m 于 2022-11-12 发布在其他

关注(0)|答案(2)|浏览(100)

我正在工作的邮件模板库存确认电子邮件和我必须做的邮件包含的东西，我正在努力寻找资源，所以任何资源有关它，如果你知道是有帮助的。我试图使一个响应邮件模板，也看起来不错的outlook/microsoft邮件和使圆圈的项目颜色提出了最麻烦的我。

magento

来源：https://stackoverflow.com/questions/70364018/question-regarding-css-in-outlook-mail-temp

2条答案

按热度按时间

vshtjzan1#

下面是一个示例，说明如何使用HTML、CSS和Windows上 The Outlooks 的专用VML回退来实现这一点。

<!DOCTYPE html>
<html lang="en" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Question regarding CSS in Outlook mail temp</title>
  <!-- https://stackoverflow.com/questions/70364018/question-regarding-css-in-outlook-mail-temp?noredirect=1#comment124384406_70364018 -->
    <!--[if mso]>
    <xml>
    <o:OfficeDocumentSettings>
        <o:PixelsPerInch>96</o:PixelsPerInch>
    </o:OfficeDocumentSettings>
    </xml>
</head>
<body>
  <!--[if !mso]><!-->
  <div style="width:24px;" role="img" aria-label="Pink color">
    <div style="border:4px solid #000; border-radius:50%;">
      <div style="padding:2px;">
        <div style="width:12px; height:12px;background-color:#f587d8; border-radius:50%;"></div>
      </div>
    </div>
  </div>
  <!--<![endif]-->
    <!--[if mso]>
  <v:group style="position:relative; width:24px; height:24px;" coordsize="24,24">
      <v:oval style="position:absolute; left:0; top:0; width:24px; height:24px; z-index:1;" stroked="false" fillcolor="#000000"></v:oval>
      <v:oval style="position:absolute; left:4px; top:4px; width:16px; height:16px; z-index:2;" stroked="false" fillcolor="#ffffff"></v:oval>
      <v:oval style="position:absolute; left:6px; top:6px; width:12px; height:12px; z-index:3;" stroked="false" fillcolor="#f587d8"></v:oval>
  </v:group>
    <![endif]-->
</body>
</html>

这里是test results of rendering on Email on Acid。

赞(0）回复(0）举报 2022-11-12

mrfwxfqh2#

您可以在电子邮件中使用**<style>**标签来创建类似的内容。也支持内联样式。
第一个

赞(0）回复(0）举报 2022-11-12