Question

您好我在使用以下代码在div标签的右侧和左侧获得阴影，但div的所有四个边都被遮蔽...

.shadow1 {

   border-right:1px solid #8d8d8d;
   border-left:1px solid #8d8d8d;
   -moz-box-shadow:0px 0px 5px 0px #000;
 -webkit-box-shadow: 0px 0px 5px 0px #000 ;
       box-shadow: 0px 0px 5px 0px #000;

}

有没有办法让阴影只出现在div的右侧和左侧......？任何帮助将不胜感激...提前感谢... :)）

Answer 1

这似乎工作正常：）

box-shadow: 5px 0px 5px -4px #000,
            -5px 0px 5px -4px #000;

编辑：哦，我迟到了：看起来我们或多或少得出了相同的结论。

Answer 2

试试这个：

jsFiddle

div {
    width:200px;
    height:200px;
    margin:20px;
    border:1px solid #8d8d8d;

    -weibkit-box-shadow: 5px 0px 10px -5px #000, -5px 0px 10px -5px #000;
        -moz-box-shadow: 5px 0px 10px -5px #000, -5px 0px 10px -5px #000;
             box-shadow: 5px 0px 10px -5px #000, -5px 0px 10px -5px #000;
}

Answer 3

试试这个：http://css3-drop-shadows.herokuapp.com/app

它最后提供了一个css3生成器。

它使用：before和：after

css - 左右阴影

3 个答案: