【css】-box-shadow边框阴影/lighten()变浅 / darken()变深

(1)背景色、颜色百分比变淡/变深

方法：使用 lighten() 变浅/ darken() 变深

background-color:lighten(blue,50%);
color:lighten(blue,50%);

第一个参数接受 $color$ 类型，第二个参数接受 $amount$ 数字类型

(2)box-shadow边框阴影

box-shadow: 2px 0 0 0 rgba(0,0,0,0.5);

参数类型：

[1]第一个参数指定x轴的偏移量，支持正负数；

[2]第二个参数指定y轴的偏移量，支持正负数；

[3]第三个参数指定z轴（垂直于屏幕方向）的偏移量，支持正负数；效果类似淡化/锐化；

[4] rgba是第四个参数color类型；你也可以指定其他的十六进制数，颜色名称等，这里使用rgba主要是使用rgba的第四个参数透明度。

演示

box-shadow: 0 2px 0 rgba(0,0,0,0.5);

box-shadow: 2px 0 0 0 rgba(0,0,0,0.5);