首页 新闻 会员 周边

css如何模糊化<body>元素的背景图?

0
悬赏园豆:5 [已解决问题] 解决于 2022-05-02 21:00

代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>模糊化背景图</title>
    <style>

        body {
            background-image: url("image/bjt01.jpg");
            background-repeat: no-repeat;
            background-attachment: fixed;
            background-size: cover;
        }
    </style>
</head>
<body>

</body>
</html>

实际效果如图:

期望可以把body元素的背景图模糊化,怎么做?

body元素加 backdrop-filter: blur(30px);没效果呀!!!

liaowenxiong的主页 liaowenxiong | 初学一级 | 园豆:33
提问于:2021-12-08 11:47
< >
分享
最佳答案
0
收获园豆:5
〆灬丶 | 老鸟四级 |园豆:2307 | 2021-12-08 13:54
其他回答(2)
0

背景图专门放一个div,然后使用 filter: blur(30px);

dudu | 园豆:31048 (高人七级) | 2021-12-08 11:55

做个div,div背景图不能完整显示呀,div的高度和宽度怎么设置,图片能够完整全屏显示

支持(0) 反对(0) liaowenxiong | 园豆:33 (初学一级) | 2021-12-09 21:51
0
红色的风 | 园豆:76 (初学一级) | 2021-12-10 16:23
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册