倒影box-reflect(可图片可文字)
程序员文章站
2022-09-04 23:17:08
需要写兼容写法: -webkit-box-reflect:below 3px -webkit-(repeating)linear/redial-gradient(...); 1.先写direction定义方向: above:倒映在其对象的上边 below:倒映在其对象的下边 left:左边 righ ......
需要写兼容写法:
-webkit-box-reflect:below 3px -webkit-(repeating)linear/redial-gradient(...);
1.先写direction定义方向:
above:倒映在其对象的上边
below:倒映在其对象的下边
left:左边
right:右边
2.offset定义对象与倒影的距离,默认为0,取值包括px和百分比,百分比是根据对象的大小进行确定。px和百分比都可为负值。
<offset>
-
<length>:
用长度值来定义倒影与对象之间的间隔。可以为负值
-
<percentage>:
用百分比来定义倒影与对象之间的间隔。可以为负值
3.mask-box-images定义
<mask-box-image>
-
none:
无遮罩图像
-
<url>:
使用绝对或相对地址指定遮罩图像。
-
<linear-gradient>:
使用线性渐变创建遮罩图像。
-
<radial-gradient>:
使用径向(放射性)渐变创建遮罩图像。
-
<repeating-linear-gradient>:
使用重复的线性渐变创建背遮罩像。
- <repeating-radial-gradient>:
上一篇: 调侃
下一篇: 天天吵吵,为啥不离婚?