CSS3滤镜模糊定义边缘

img {
  filter: blur(5pX);
  -webkit-filter: blur(5pX);
  -moz-filter: blur(5pX);
  -o-filter: blur(5pX);
  -ms-filter: blur(5pX);
}

您可以将其放在< div> with overflow：hidden;并设置< img>到margin：-5px -10px -10px -5px ;.

演示：

输出

CSS

img {
    filter: blur(5pX);
        -webkit-filter: blur(5pX);
        -moz-filter: blur(5pX);
        -o-filter: blur(5pX);
        -ms-filter: blur(5pX);
    margin: -5px -10px -10px -5px;
}

div {
    overflow: hidden;
}
​

HTML

<div><img src="http://placekitten.com/300" />​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​</div>​​​​​​​​​​​​