backdrop-filter

#backdrop-filter

利用backdrop-filter属性，你将可以对，元素背后的区块执行，诸如，模糊、变暗等操作。常应用于制作毛玻璃的效果。

#浏览器支持

#毛玻璃

这里以毛玻璃为例子，

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-kfqVUXhD-1576144848851)
HTML:

    
        
            backdrop-filter: blur(15px)
        
    

CSS:

.wrapper{   margin: 0 auto;   width: 350px;   height: 500px;   background-image: url('https://www.ditto.ink/images/bg10.png');   background-position: center center;   background-repeat: no-repeat;   background-size: cover;}.container{   display: flex;   justify-content: center;   align-items: center;}.box{   width: 350px;   height: 50px;   backdrop-filter: blur(15px);   background-color: rgba(255, 255, 255, 0.3);   color: rgba(255,255,255,.5);   text-align: center;}

This is my Blog website