css边框阴影走一波

271 阅读1分钟

box-shadow:    0px -10px 0px 0px #ff0000,   /*上边阴影  红色*/

                -10px 0px 0px 0px #3bee17,   /*左边阴影  绿色*/

                10px 0px 0px 0px #2279ee,    /*右边阴影  蓝色*/

                0px 10px 0px 0px #eede15;    /*下边阴影  黄色*/

box-shadow 属性

box-shadow: 2px 3px 4px 1px rgba(0, 0, 0, 0.2);四个属性的详解,如下图所示

offset-x (X轴坐标值)offset-y(Y轴坐标值)blur-radius(模糊距离)(spread-radius) 阴影大小(color) 阴影颜色
2px3px4px1rgba(0, 0, 0, 0.2)

下面的这个属性是我设置的没有上边框,只有左,右,下边框的css设置

box-shadow: 
0px 0px 0px 0px rgba(0,0,0,0.1),
-15px 0px 14px -12px rgba(0,0,0,0.1),
15px 0px 14px -12px rgba(0,0,0,0.1),
0px 15px 14px -12px rgba(0,0,0,0.1);