看看图片。我希望整个背景被模糊(就像它是现在)除(DIV)标记的区域。该DIV是透明的,我想要的是,你可以清楚地看到过它。
你可以在这里看到我的意思:https://i.stack.imgur.com/4IvYB.png
以下是我找到了!
HTML
<div class="bg-image"></div>
CSS
body, html {
height: 100%;
margin: 0;
}
.bg-image {
/* The image used */
background-image: url("https://i.imgur.com/R4jk5aR.jpg");
/* Add the blur effect */
filter: blur(8px);
-webkit-filter: blur(8px);
/* Full height */
height: 100%;
/* Center and scale the image nicely */
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}