html 背景图像与文本叠加，甚至不给出背景图像

jaql4c8m 于 2022-12-09 发布在其他

关注(0)|答案(4)|浏览(186)

我试图在我的背景上从上到下得到一个线性梯度，但我原来得到的背景图像现在消失了。然而，如果我使用正常的背景图像属性，我得到了我的图像正确。

background: linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.9),url(bg.jpg));
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    height: 100vh;

它应该给予适当的背景没有梯度，但相反的图像消失了。有人请帮助！

Html

来源：https://stackoverflow.com/questions/74712040/background-image-overlay-with-text-not-even-giving-the-background-image

4条答案

按热度按时间

z5btuh9x1#

请试试这个。它会正常工作的。

background-image: linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.9)),url(bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    height: 100vh;
    opacity:0.5;

赞(0）回复(0）举报 2022-12-09

6bc51xsx2#

使用不透明度：0.1;我希望这能解决你的问题

赞(0）回复(0）举报 2022-12-09

w41d8nur3#

您可以使用以下语法：-

background: linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.9),url(bg.jpg));
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    height: 100vh;
    opacity:0.1;

赞(0）回复(0）举报 2022-12-09

kr98yfug4#

看看这个。
第一个

赞(0）回复(0）举报 2022-12-09