html - 底部 body 上的盒子阴影

Question

使用此代码，我可以在窗口顶部应用阴影:http://jsbin.com/awedir/1/edit

但我想要它在底部。那么我该如何实现呢？

body:before 
{ 
   content: "";
   position: fixed;
   top: -10px;
   left: 0;
   width: 100%;
   height: 10px;
   z-index: 100;
   -webkit-box-shadow: 0px 0px 10px rgba(0,0,0,.8);
   -moz-box-shadow: 0px 0px 10px rgba(0,0,0,.8);
   box-shadow: 0px 0px 10px rgba(0,0,0,.8);
   }

Answer 1

好的，从评论延伸:

只需“反转”您使用 ::before 的方式:

http://jsbin.com/uyosuk/1

body::after
{ 
   content: "";
   position: fixed;
   bottom:-10px;
   left: 0;
   width: 100%;
   height: 10px;
   z-index: 100; 
   box-shadow: 0px 0px 10px rgba(0,0,0,.8);
}