css模糊遮罩效果_如何实现遮罩模糊样式？

如下图，渐变模糊

用linear-gradient似乎不能完美实现

background: -webkit-linear-gradient(left, rgba(255, 255, 255, .8), #ffffff);

/* Safari 5.1 - 6.0 */

background: -o-linear-gradient(right, rgba(255, 255, 255, .8), #ffffff);

/* Opera 11.1 - 12.0 */

background: -moz-linear-gradient(right, rgba(255, 255, 255, .8), #ffffff);

/* Firefox 3.6 - 15 */

background: linear-gradient(to right, rgba(255, 255, 255, .8), #ffffff);

/* 标准的语法(必须放在最后) */

最后效果

background: -webkit-linear-gradient(right, #fff, rgba(255, 255, 255), rgba(255, 255, 255, .6));

/* Safari 5.1 - 6.0 */

background: -o-linear-gradient(left, #fff, rgba(255, 255, 255), rgba(255, 255, 255, .6));

/* Opera 11.1 - 12.0 */

background: -moz-linear-gradient(left, #fff, rgba(255, 255, 255), rgba(255, 255, 255, .6));

/* Firefox 3.6 - 15 */

background: linear-gradient(to left, #fff, rgba(255, 255, 255), rgba(255, 255, 255, .6));

border-radius: 100% 0 0 100%;