background-image：
chrome浏览器：线性渐变支持较好，径向渐变支持不太好~
通过png背景透明的方法，来决定要显示的部分。
background-origina和background-clip 的区别：
background-clip ，指的是裁剪的位置。其图片的开始位置是已经固定的，不过显示的部分不一样。而background-origina指的是背景图片的开始位置。相同的一点是两者都有三个值：border-box,padding-box,content-box;origina如果图片的宽度超过容器的宽度，则会继续铺垫。
chrome浏览器支持linear-radius很好，无需加前缀，而radial-gradient支持不好，需要加webkit前缀，对于火狐，两者都支持，不过要加moz
-webkit-linear-gradient( [<point> || <angle>,]? <stop>, <stop> [, <stop>]* )
-webkit-radial-gradient([<bg-position> || <angle>,]? [<shape> || <size>,]? <color-stop>, <color-stop>[, <color-stop>]*);
蒙板的属性基本与background的相关属性无异。
有：image,clip,orgina,linear-gardient,radial-gradient，position，repeat,等属性