gpt4 book ai didi

CSS 的 HTML div 背景并不总是有效

转载 作者:行者123 更新时间:2023-11-28 01:25:08 25 4
gpt4 key购买 nike

我的 <body> 中有这个片段:

<div class="hero">
...content...
</div>

我觉得没什么特别的。我的 CSS 在图像类中包含一个“背景:”。 CSS 看起来像这样并且有效:

.hero {
position: relative;
background: url(http://www.example.com/img/background.png) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
text-align: center;
color: #ef4d39;
padding-top: 110px;
min-height: 500px;
letter-spacing: 2px;
font-family: "Montserrat", sans-serif;
left: 0;
width: 100%;
}

但是当我把它改成这个(我试图让它成为本地而不是绝对的许多方法之一)它不起作用:

background: url("img/background.png") no-repeat center center fixed; //Should be the proper way
background: url('img/background.png') no-repeat center center fixed; //Found it with single quotes in tutorials as well
background: url(img/background.png) no-repeat center center fixed; //No quotes since the original snippet doesn't contain quotes
background-image: url("img/background.png") no-repeat center center fixed; //Found this tag in tutorials as well

我非常吃惊(但我也不是一个程序员)但我不明白为什么原来的行有效而我试过的其他行不工作。这是离线测试的。谁能解释为什么以及如何让它适用于相关图像?

编辑:感谢 DBS 的评论,我发现出了什么问题,正确的上下文应该是:

background: url("../img/background.png") no-repeat center center fixed;

.css 位于子文件夹“css”中,图像位于子文件夹“img”中。感谢你们的帮助!

最佳答案

我建议你不要把这些图片放在同一个网站上,也许它们在那里但你看不到它们。

您必须将此图像附加到 html 上(查找 img 标签),在您的 div 中,然后您可以将其放入每个图像的 css 中,此外最好将此命令分开。试试看:

background-repeat:no-repeat; 
background-attachment:fixed;
background-position:center;

当然你只看到了一个,但所有这些都使用你的浏览器调试器来检查它们是否存在(按 f12)。

希望对您有所帮助。

关于CSS 的 HTML div 背景并不总是有效,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32442982/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com