盒子阴影的替代品

时间:2014-03-10 10:05:00

标签: css css3

我想在我的电子邮件中给出盒子阴影,但gmail和yahoo不支持这个属性,那么在邮件中提供盒子阴影的其他技巧是什么?

如果是,请尽快通知我

3 个答案:

答案 0 :(得分:4)

Gmail不支持完整的HTML电子邮件页脚,我对该主题进行了大量研究。你可能已经知道建立一个强大的电子邮件页脚的细节,但如果你不知道;查看Campaign Monitor的博客。

到目前为止,需要使用图像来实现框阴影(我不建议这样做,因为默认情况下大多数图像都被阻止,除非您被Gmail用户信任)。

另一种选择是一个颜色填充的单元格沿着你试图创建阴影的任何框的边缘放置 - 仍然非常简陋。我的解决方案是优雅降级,无论用户启用了什么,都能使您的设计运行良好 - 尽管如果他们拥有您需要的所有功能,他们当然会获得更性感的体验!

希望有所帮助。

答案 1 :(得分:3)

唯一的可能性是:

  1. 带有框阴影的单个图像
  2. 元素边缘上的类似阴影的图像,用于模拟盒子阴影
  3. 我想是的。

答案 2 :(得分:1)

我需要在响应按钮上留下清晰的阴影,所以在我的情况下,我能够直接在我的按钮下使用faux-shadow类div来模拟它。我使用border-radius使它们看起来更“像按钮”。 https://codepen.io/anon/pen/bRrbLp