<div class="layered-paper">
Howdy
</div>
.layered-paper {
background: #eee;
box-shadow:
0 1px 1px rgba(0,0,0,0.15), /* The top layer shadow */
0 10px 0 -5px #eee, /* The second layer */
0 10px 1px -4px rgba(0,0,0,0.15), /* The second layer shadow */
0 20px 0 -10px #eee, /* The third layer */
0 20px 1px -9px rgba(0,0,0,0.15); /* The third layer shadow */
}
非常棒的CSS设计。
惊人的效果!现在我的Facebook粉丝专栏也有了分层效果……!
前几天我也做了类似的事情!在使用box-shadow实现此效果后,我产生了无数关于更多用途的想法。 这是我使用的一个小截图。抱歉 - 我现在无法展示更多内容!
不错的效果。
这是我去年3月使用CSS3创建的“纸堆”的博文 -
http://alwaystwisted.com/post.php?s=2011-03-06-creating-a-css3-paper-stack
使用CSS实现的超棒效果。
是否有一种方法可以翻转此效果,使其向上而不是向下?这对我的一个项目很有用!
谢谢!