[英]Why wont my background image show up using CSS?
因此,我试图通过单独的CSS文件调用背景图片。 HTML文件和CSS文件处于同一级别,但是背景图像低两个级别。
例:
index.html
stylesheet.css
资源>资产> 背景图像
这是我的html:
<div class="second-background">
<h2>Our</h2>
<div class="purpose-heading"><h2>Purpose</h2></div>
<p class="textstyle6">To provide unaccompanied runaway and homeless youth with a safe and nurturing environment where they can develop the needed skills to become active, healthy, successful members of our future world.</p>
<div id="rectangle"><p class="textstyle2">7,085 MEALS SERVED. 511 DROP-IN SERVICES.<br/>245 STREET OUTREACH HOURS. 64 SHELTERED YOUTH.</p></div>
</div>
这是我的CSS:
.second-background {
background-image:url("../resources/assets/purpose.png");
}
#rectangle {
width: 1110px;
height: 105px;
background-color: #ffffff;
}
路径错误,请从CSS的图像路径中删除../
。 结构是否如您所说的那样。
在此处了解更多关于文件路径的信息: https : //www.w3schools.com/html/html_filepaths.asp和此处: https : //css-tricks.com/quick-reminder-about-file-paths/
路径规则分解如下: ../表示“向上一级”(即,直到包含样式文件夹的文件夹);
images /表示“转到图像文件夹”; 和bg.gif指定该文件。
根据您提供的文件夹结构:正确的方法是:
.second-background {
background-image:url("resources/assets/purpose.png");
}
#rectangle {
width: 1110px;
height: 105px;
background-color: #ffffff;
}
希望能帮助到你
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.