使用background-imageonbody標(biāo)簽和div其中的two 。我需要為每個(gè)都有模糊的背景 div。我現(xiàn)在能做的就是對(duì)background-image每個(gè)進(jìn)行設(shè)置div并使用filter: blur屬性來(lái)模糊它們。但因?yàn)槲蚁M麄€(gè)頁(yè)面具有相同的背景(不為每個(gè)頁(yè)面分開(kāi)div),所以我希望它的方式是在標(biāo)簽background-image 上設(shè)置body,然后模糊div元素。這就是我嘗試過(guò)的:body { background-image: url(public/images/billy-huynh-W8KTS-mhFUE-unsplash\ \(1\).jpg); background-attachment: fixed; background-size: cover; display: grid; align-items: center; justify-content: center; height: 100vh; width: 100vw; position: relative;}.parent-div::before { content: ""; display: block; position: absolute; top: 0; bottom: 0; right: 0; left: 0; width: 100%; height: 100%; filter: blur(5px);}.parent-div { position: relative;}HTML 代碼:<body><div class=" parent-div"> <div class=" child-div"> <h4 class=" text-light">Hello world!!</h4> </div></div><div class=" parent-div"> <div class=" child-div"> <h4 class=" text-light">Hello world!!</h4> </div></div>事實(shí)上,我想模糊div沒(méi)有背景圖像的元素。有辦法這樣做嗎?謝謝
通過(guò)CSS模糊沒(méi)有背景圖像的元素
狐的傳說(shuō)
2023-10-17 17:01:03