如何在CSS 3中将一个图像放在另一个图像上？

Question

我正在尝试创建下面给出的盒子阴影效果。阴影是使用纯CSS3代码开发的：

但是由于背景图像，阴影没有显示如下所示。

如何将阴影置于顶部？

Answer 1

如果您使用图像作为阴影，则需要相对定位它并使用z-indexing。正如上面的帖子所暗示的那样，你可以更具体一点吗？

Answer 2

这样的事情可能会为你做的工作

<div style="position: relative; left: 0; top: 0;">
  <img src="image1.jpg" style="position:absolute; top: 25px; left: 25px; z-index: 1;"/>
  <img src="image2.jpg" style="position:absolute; top: 80px; left: 25px; z-index: 3;"/>
</div>

希望它有所帮助。

Answer 3

如果您必须将图像作为背景。那么像上面提到的方法将是一种方法。如果您使用的是纯色，则可以使用CSS3。

这里有两个很棒的教程。希望它服务。 http://www.red-team-design.com/how-to-create-slick-effects-with-css3-box-shadow http://www.paulund.co.uk/creating-different-css3-box-shadows-effects