當模糊背景圖像的大小時保留硬邊緣：覆蓋

Question

因此，我設置了一個background-size：cover的背景圖片。迄今爲止工作。 但是，當我添加一個模糊它顯然會失去它很難egde。我怎樣才能去除模糊的邊緣？也許背景必須放大，然後切斷一些溢出：隱藏？

我會用溢出的包裝div：隱藏在img周圍，但是我不能使用background-size：cover，對吧？

這是它的外觀：http://jsfiddle.net/RyQRY/

，這是它應該如何看：http://cl.ly/image/0B2f191p2m0i

HTML

<div id="background"></div> 

CSS

#background { 
    position: absolute; 
    z-index: -999; 
    top: 0px; 
    height: 546px; 
    width: 100%; 
    background-image: url(../img/background.jpg); 
    background-size: cover; 
    -webkit-filter: blur(50px); 
} 

Answer 1

第二個鏈接是死的，我不知道應該如何。

但是你可以隱藏所迷離邊緣：

position: absolute; 
    top: -25px; 
    bottom: -25px; 
    left: -25px; 
    right: -25px; 

，但你不能使用overflow:hidden之後，因爲它會裁剪bluring區域。 而你發現自己與你在同一個地方））

使用:after。

這不是很beau​​tyfull的解決方案，但是......

你可以看這裏：

http://jsfiddle.net/RyQRY/10/

可能這將是有用的你...