使用CSS向三面添加光晕

我有一个盒子与另一个盒子重叠形成一种L形状,我试图在整个L形状周围实现发光,因此只需要在这些盒子中的一个盒子的三个面上发光.

我已经尝试过使用Box-shadow属性,但似乎无法让它只适用于3个边,这是正确使用的方法还是有另一种使用边框的方法我可以使用它来实现三面?

这是我一直在尝试使用的代码

-moz-Box-shadow: 0 -1px 5px #80abc6;
-webkit-Box-shadow: 0 -1px 5px #80abc6;
Box-shadow: 0 -1px 5px #80abc6;

解决方法

你可以用css:after属性来做.像这样:
div{
    width:100px;
    height:30px;
    -moz-Box-shadow: 0 -1px 15px #80abc6;
    -webkit-Box-shadow: 0 -1px 15px #80abc6;
    Box-shadow: 0 -1px 15px #80abc6;
    margin:30px;
    position:relative;
}
div:after{
    content:'';
    width:10px;
    height:100%;
    background:#fff;
    position:absolute;
    top:0;
    left:-10px;
}

检查这个http://jsfiddle.net/QBQJn/1/

相关文章

Css3如何实现鼠标移上变长特效?(图文+视频)
css3怎么实现鼠标悬停图片时缓慢变大效果?(图文+视频)
jquery如何实现点击网页回到顶部效果?(图文+视频)
css3边框阴影效果怎么做?(图文+视频)
css怎么实现圆角边框和圆形效果?(图文+视频教程)
Css3如何实现旋转移动动画特效