Question

我想在同一行电子邮件中设置一个表和一个图像。 display: inline;在任何浏览器中工作正常，但在outlook电子邮件中，所有内容都在一列中，我需要它们在同一行中。请帮我解决。

＆＃13;

<html>

<head>
  <title></title>
  <style>
    img {
      display: inline;
      width: 100px;
      height: 100px;
    }
    
    h1 {
      display: inline;
    }
  </style>
</head>

<body> <img src="Image1.jpg">
  <h1>afdsgdf dfgsdf dsfgf</h1> <img src="Image2.jpg">
</body>

</html>

＆＃13;

Answer 1

为电子邮件客户端编码HTML与编写Web浏览器完全不同。最重要的是，每个电子邮件客户端都会以不同方式呈现您的代码这是一个非常广泛的主题，所以我建议在网上进行一些研究。但是，为了帮助您入门，为电子邮件编写HTML的最可靠方法是使用带有HTML表格标签的表格布局等。

许多电子邮件客户端也会忽略样式标记，因此您可能希望像这样编写CSS内联 -

 <img style="display: inline; width: 100px; height: 100px;" src="img1.jpg" /> 
 <h1 style="display:inline"> Im a header </h1>

希望这有帮助

display：inline-block not working Outlook Email HTML

1 个答案: