在CSS中添加背景图片

Question

我正在尝试在一页产品网站上的第一个面板中添加背景图片。 由于某种原因（我不知道），我的背景图片无法加载。 请帮忙！

HTML：

<!-- panel 1 -->
<div class="header">
<h3> Introducing the </h3>
<h1> Vespa Tribute </h1>
<p> Scheduled for release in June 2016, this limited edition scooter will only      be produced 250 times. Enter your email below to be partnered with a Vespa representative who will ensure that you stay updated and informed about how be part of this exclusive venture. </p>
<input type="text" name="emailaddress" placeholder="Email address">
<button type="button">Get exclusive Info</button>
<img src="images/vespa1.png" alt="vespa" />

CSS：

/ *标题面板* /

.header {
background-image: url('images/image1.png');
background-size: cover;
background-repeat: no-repeat;
}

Answer 1

您的div未关闭，但我假设您只是未粘贴整个代码。

您的CSS代码显示HEADER PANEL-这是否意味着您没有将其用作单独的样式表？ 如果在单独的工作表中，则必须指定相对于样式表位置而不是HTML位置的路径。

您是在自己的计算机上工作还是在实时服务器上测试此代码？ 您是否正在使用自己的CSS库在CMS或某些其他此类附件中工作？

我建议执行Nathan建议的操作，方法是从地址栏中加载文件路径，以确保它是正确的文件路径。

接下来，如果您正在实时测试此代码，则尝试指定确切的文件路径-“ http://server.com/images/image1.png ”

之后，如果仍然无法正常运行且文件路径正确，请尝试打开所有链接的样式表并查找与'img'元素关联的任何值-逐个删除它们，同时刷新它们之间的页面以查找冲突的代码。

否则对我来说看起来不错，所以如果这些建议中的任何一项都无法解决，我会感到惊讶。