css之单边阴影
需求:在网上找的其他博客上说单边阴影需要牺牲掉模糊,实际上牺牲掉模糊直接用border不就好了
效果:
原理:
1.在左边的外阴影就是右边的内阴影
2.将box-shadow写在before或者after上面,然后将父元素设置为overflow:hidden
代码:
#footer{
position: relative;
z-index: 800;
height: 27px;
overflow: hidden;
}
&:before{
content: "";
position: absolute;
left:0;
width: 100%;
height:0;
box-shadow: 0 0 6px 4px rgba(0,0,0,0.1);
background:#eee;
}
钻研不易,转载请注明出处。。。。。。