方法建立文本倒置效应反映CSS3的盒子

Grammar:


CSS代码将内容复制到剪贴板。


反映:没有|盒
以上=左下方放| | |
= |
没有= | | | | |




默认值:无
应用于:所有元素
继承:没有


价值:
没有:没有反射
演示:WebKit看到简单的图片倒置
上图:指定的反转图像位于对象的顶部。
下面:指定的反射位于对象的底部。
左:指定的反射在物体的左边。
右:指定的反射在对象的右侧。
演示:WebKit看到图片和反射时间间隔
反转图像和对象之间的间隔是由长度值定义的,可以是负的。
百分比用于定义反射和对象之间的间隔。可以是负的。
演示:更真实的图片倒影反射和梯度看到WebKit
无掩码图像
掩码图像使用绝对地址或相对地址指定。
使用线性渐变创建掩码图像。
使用径向(辐射)梯度创建掩码图像。
使用重复的线性渐变来创建一个反掩码。
使用重复的径向(放射性)梯度创建掩码图像。


如果您需要简单的反射,您可以这样做:
代码

CSS代码将内容复制到剪贴板。


盒子反射:在下面;




影响


注意设置反射元素的填充以影响反射的位置。
允许您定义反射和元素之间的距离:
代码


CSS代码将内容复制到剪贴板。


反映:在10px盒;




影响


允许您使用渐变图像或图像作为掩码。
代码


CSS代码将内容复制到剪贴板。


箱反映:下面1px线性梯度(透明、透明50%、RGBA(0,0,0,。3));




影响