CSS實現背景模糊效果可以很好地增強網頁的視覺效果，讓頁面看起來更加清新自然。具體實現方法如下：

.blur {
background-image: url(bg.jpg);
filter: blur(3px);
-webkit-filter: blur(3px);
background-size: cover;
height: 500px;
}

上述代碼中，我們給元素添加一個名為.blur的class，其中background-image屬性指定了背景圖片路徑，filter和-webkit-filter屬性則分別指定了模糊程度為3像素。最后，設置background-size屬性為cover，以感官上完全填滿元素區域，并設置元素高度為500像素。

如果想實現只讓背景模糊，而讓文字信息清晰可見的效果，我們可以將背景圖片單獨處理，然后將模糊處理后的圖片作為背景。代碼如下：

.blur-div {
position: relative;
z-index: 1;
background-image: url(bg.jpg);
background-repeat: no-repeat;
background-size: cover;
height: 500px;
}
.blur-div:after {
content: "";
position: absolute;
z-index: -1;
top: 0; bottom: 0; left: 0; right: 0;
background-image: url(bg.jpg);
filter: blur(3px);
-webkit-filter: blur(3px);
background-size: cover;
}

上述代碼中，我們給父元素添加一個.blur-div的class，然后在元素上方用CSS3偽元素after創建了一個新的全屏背景元素，并將其層級設置為-1。然后，為該元素添加和之前一樣的背景圖片，同時設置filter和-webkit-filter屬性為blur(3px)，來實現模糊效果。最后再將子元素的層級設置為1，就能實現文字信息清晰，背景圖片模糊的效果。