CSS3-阴影参数基础
box-shadow
语法:text-shadow: x-shadow y-shadow distance color;
值 | 描述 |
x-shadow | 必需。水平阴影的位置。允许负值。 |
y-shadow | 必需。垂直阴影的位置。允许负值。 |
distance | 可选。模糊的距离。 测试 |
color | 可选。阴影的颜色 |
text-shadow
语法:box-shadow: x-shadow y-shadow distance size color inset/outset;
值 | 描述 |
x-shadow | 必需。阴影水平偏移量,可正可负,正值表示阴影在右边,负值表示阴影在左边。 |
y-shadow | 必需。阴影垂直偏移量,可正可负,正值表示阴影在上边,负值表示阴影在下边。 |
distance | 可选。阴影模糊距离。只能为正值,值为0时,表示阴影不具有模糊效果,值越大阴影的边缘就越模糊。 |
size | 可选。阴影扩展半径。可正可负,正值表示整个阴影都延展扩大,负值表示缩小。 |
color | 可选。阴影的颜色。 |
inset | 可选。将外部阴影 (outset) 改为内部阴影。 |
box-reflect
向框添加一个或多个倒影。 (1)direction:定义倒影的方向,取值包括: above:倒影在对象的上边。 below:倒影在对象的下边。 left:倒影在对象的左边。 right:倒影在对象的右边。 (2)offset:定义倒影与对象之间的间隔,可正可负,默认为0。取值包括: 长度值 百分比(根据对象的尺寸进行确定) (3)mask-box-image:定义遮罩图像,该图像将覆盖投影区域,默认为无遮罩。 <url>:使用绝对或相对地址指定遮罩图像。 <linear-gradient>:使用线性渐变创建遮罩图像。 <radial-gradient>:使用径向(放射性)渐变创建遮罩图像。 <repeating-linear-gradient>:使用重复的线性渐变创建背遮罩像。 <repeating-radial-gradient>:使用重复的径向(放射性)渐变创建遮罩图像。
相关推荐
云中舞步 2020-11-12
杨德龙 2020-11-11
JohnYork 2020-10-16
wangzhaotongalex 2020-09-22
xiaoseyihe 2020-11-16
不要皱眉 2020-10-14
Crazyshark 2020-11-13
K先生 2020-11-10
momode 2020-09-11
思君夜未眠 2020-09-04
点滴技术生活 2020-08-21
MaggieRose 2020-08-19
kevinweijc 2020-08-18
wintershii 2020-08-17
vapaad 2020-08-17
wera00 2020-08-17
移动开发与培训 2020-08-16
ReunionIsland 2020-08-16
JimyFengqi 2020-08-16