如何在一条线上只创建左右两侧的阴影？

Question

我有一条宽度:15px; 和2px的高度;
我的问题是,如何只在左右两侧创建阴影？

Answer 1

这个小提琴的例子只显示阴影:

• 顶部和底部
• 左和右
• 最佳

有了它,你应该能够做任何形式的阴影.

http://jsfiddle.net/rafaelchiti/5jdHW/

代码:

div {
  margin-top: 20px;
  margin-left: 20px;    
  width: 100px;
  height: 100px;
}

.horizontal {
  box-shadow: 0px 15px 10px -11px rgba(0, 0, 0, .1) inset, 
              0px -15px 10px -11px rgba(0, 0, 0, .1) inset;  
}

.vertical {
  box-shadow: 0px 15px 10px -11px rgba(0, 0, 0, .1) inset, 
              0px -15px 10px -11px rgba(0, 0, 0, .1) inset;  
}

.one-side {
  box-shadow: 0px 15px 10px -11px rgba(0, 0, 0, .1) inset;
}

希望这有帮助.