通过电子邮件发送 html 时，box-shadow 不起作用答案

【问题标题】：box-shadow is not working when sending html by email通过电子邮件发送 html 时，box-shadow 不起作用
【发布时间】：2018-07-11 18:37:51
【问题描述】：

我正在使用 html 发送电子邮件。由于大多数提供商阻止了图像，我使用 box-shadow 来绘制我需要的图像。但是，在浏览器中显示正常，但在电子邮件中没有出现。难道我做错了什么？有什么选择吗？

</head>
<body style="height: 100%;width: 100%;">
<div class="pixels" style="border-radius: 0;display: inline-block;width: 1px;height: 1px;box-shadow: 0px 0px rgba(228,232,233,1),0px 1px.......;"><p> teste</p>
</div></body>
</html>

【问题讨论】：

请包含完整的样式标签。你有........，所以我们不可能测试你的代码并提出建议。
超出字数限制，无法输入完整代码。

标签： html css html-email

【解决方案1】：

很多提供商不支持 box-shadow。列表here

【讨论】：

绘制图像的任何替代方法？
您可以对图像进行 base-64 编码并将其嵌入到电子邮件中，如下所示：hastebin.com/eruluhibaj.xml
再次检查，base64 可能不被普遍支持。这个线程有替代品：stackoverflow.com/questions/9110091/…
没错，我已经测试过base64图像，但仍然无法正常工作，无论如何收件人仍然需要授权图像显示。我将测试嵌入的图像并在此处发布结果。感谢您的关注。

【解决方案2】：

它比将图像转换为 base64 效果更好。出于某种原因，一些 base64 图像出现二进制代码，并且仅在您单击“查看完整消息”（在 gmail 中）时出现。使用内联图像已解决此问题。非常感谢您的帮助。我已经不知道该怎么做了，我没有想到那种可能。如开头所述，我曾尝试使用 css (codepen.io/emad_elsaid/full/bCaLE) 包括在内，但据悉，您不能在电子邮件中使用 box-shadow。谢天谢地。

【讨论】：

这是一种更长的方法，您可以为mimic阴影创建更多具有不同颜色阴影的列。它的工作量很大，你的电子邮件可能会膨胀，但这是我唯一看到它工作的地方。因此，如果您的电子邮件很小，您可以尝试这样做。