box-reflect:
语法：box-reflect：none | <direction> <offset>? <mask-box-image>?因为不是w3c标准，所以在使用的时候要加上浏览器的私有属性
none:默认值，表示没有倒影；
direction:倒影生成的方向，分为上下左右，取值分别为above,below,left和right
offset:表示生成倒影与原图像的距离
mask-box-image:用来设置倒影的遮罩效果，可以是背景图片，也可以是渐变生成的背景图像;
示例：
显示结果如下：
可以发现图片上方只出现了一点倒影，并不是全部，这是因为，在给图片加倒影的时候，一定要给倒影生成的方向加上足够的位置。否则，只是会生成图片，而不会完全呈现出来。这时，给body加上100px的填充：
这时就可以看到图片的倒影了。当然，其他方向也是如此。
下面以right为例说明，
可以看到，生成的倒影与图片完全贴合。这时候，给box-reflect加上第二个属性offset
效果如下：
可以看到图像之间产生了一段间隙，这就是offset属性
给倒影添加遮罩效果（以向下的倒影举例）;
我们可以通过两种方式第一种是渐变生成的背景图像，第二种是外部的背景图像
以渐变为例，没有找到好的背景图片；向下的倒影效果如下:
在原来的基础上添加第三个渐变属性
效果如下：
需要说明的是，在设置渐变的时候，前面一定要有2个参数，否则不生效，另外，径向渐变目前还不支持