html文本框柔化边缘,html – CSS模糊并使用绝对div保留锐利边缘

如果img未设置为绝对值,这可以正常工作：

div 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 {

margin: 20px;

overflow: hidden;

}

但是,如果我想用一个绝对的div使用背景图像呢？

#background {

-webkit-background-size: cover;

-moz-background-size: cover;

-o-background-size: cover;

background-size: cover;

height: 100%;

width: 100%;

filter: blur(5px) brightness(0.75);

-webkit-filter: blur(5px) brightness(0.75);

-moz-filter: blur(5px) brightness(0.75);

-ms-filter: blur(5px) brightness(0.75);

-o-filter: blur(5px) brightness(0.75);

position: absolute;

background-image: url('images/bg.png');

z-index: 1;

}

使用上面的设置,如何实现相同的效果(模糊但具有尖锐边缘)？