CSS圖片模糊效果可以用來增強網站的美觀度和藝術感，同時也可以提高用戶體驗。下面介紹幾種實現CSS圖片模糊效果的方式。

.blur{
/*filter屬性用于兼容不同瀏覽器*/
-webkit-filter: blur(5px); 
filter: blur(5px);
}

通過給圖片的CSS屬性添加filter屬性，并設置blur模糊值，就可以讓圖片實現輕微的模糊效果。

.overlay{
position:relative;
display:inline-block;
}
.overlay::before{
content:"";
position:absolute;
top:0;
left:0;
background:rgba(0,0,0,0.5);
z-index:1;
opacity:0;
transition:opacity 0.5s;
width:100%;
height:100%;
}
.overlay:hover::before{
opacity:1;
}
.overlay img{
display:block;
max-width:100%;
height:auto;
z-index:2;
}

利用CSS的偽元素與過渡效果，可以實現鼠標懸停時圖片上覆蓋上透明灰色的圖層，形成模糊效果。

以上就是幾種實現CSS圖片模糊效果的方式，而且都比較簡單，可以根據實際需要選擇其中一種。