问题描述
这是一个简单的问题，我在我的 ul 元素中的代码中设置了 15 像素的左边距，填充在两个平台（gmail 和 Outlook）中看起来完全不同
do.call(cbind,strsplit(x,"\\b(?=[<>])",perl = TRUE))
# [,1] [,2] [,3]
#[1,] "a" "b2" "yy01"
#[2,] ">1" "<0" ">10"
它在 gmail 中的样子：
以及它在 Outlook 中的外观：
没有提到移动应用也存在差异。
有没有办法轻松解决这个问题？我正在寻找类似 Outlook 版本的东西！
我只需要在这两个平台上兼容，不需要雅虎或其他东西！
非常感谢任何帮助！！！
解决方法
问题是每个电子邮件客户端都有不同的默认设置，而且还有一些奇怪的地方，例如 Outlook 如何忽略 <ul>/<ol> 中的样式。因此，我们需要重置所有元素的默认值。
此外，为了一致性，我们必须仅在 <li> 项中指定边距。不是填充，也不是 <ul>/<ol>。
<ul style="margin:0;padding:0;">
<li style="margin:0 0 0 30px;padding:0;">Point 1</li>
<li style="margin:0 0 0 30px;padding:0;">Point 2</li>
<li style="margin:0 0 0 30px;padding:0;">Point 3</li>
</ul>
然后，对于 Outlook 桌面，我们必须修复文本缩进。在 <head> 部分添加以下内容：
<!--[if gte mso 9]>
<style>
li {
text-indent:-1em;
}
</style>
<![endif]-->
现在，如果您想在项目之间以及列表的顶部和底部留出一些空间，您可以执行以下操作：
<ul style="margin:0;padding:0;">
<li style="margin:20px 0 3px 30px;padding:0;">Point 1</li>
<li style="margin:3px 0 3px 30px;padding:0;">Point 2</li>
<li style="margin:3px 0 20px 30px;padding:0;">Point 3</li>
</ul>
这会在列表的上方和下方给出 20 像素，每个列表项之间的距离为 6 像素 (3 + 3)。 30px 的边距是从左边开始的边距。