作者:mobiledu2502908197 | 来源:互联网 | 2023-10-16 19:51
描述:就是把一个或多个阴影添加在边框上语法:box-shaadow:h-shadowv-shadowblurspreadcolorinset 前面两个是必须的,后面几个可选下面我根
描述:就是把一个或多个阴影添加在边框上
语法:box-shaadow:h-shadow v-shadow blur spread color inset
前面两个是必须的,后面几个可选
下面我根据控制变量讲解box-shadow里面属性是什么意思,怎么展示应用的
h-shadow (水平阴影位置) 默认是黑色,这个属性意思是往右边移动像素距离
有负值的,负值代表往左侧移动
v-shadow(垂直阴影位置)这个属性表示往上或者往下移动像素距离
有负值的,负值代表往上移动像素
blur 模糊距离 表示边界发散的模糊距离 没有负值
spread 阴影大小 表示原图形四周同时往外或者里扩大或缩小的像素值。
负值表示往内收缩的像素
color表示阴影颜色
inset 表示内测阴影 表示阴影从盒子内测出现,
里面的水平阴影正值表示阴影从左边开始显示
里面的水平阴影负值表示阴影从右边开始显示
里面的垂直阴影正值表示阴影从上部边开始显示
里面的垂直阴影负值表示阴影从下边开始显示
同一个盒子做多个阴影用逗号分开
我会在案例中展示这个功能。
本期案例分享: