CSS - 背景图片

Question

可能是非常愚蠢的问题，但是由于我试图使用我最近购买的domaine将我的网站放到网上，因此背景图像似乎无法加载。

有什么想法吗？

＆＃13;

＆＃13;

body {
  margin: 0;
  background-image: url("homepage1.jpg");
  background-size: cover;
  font-family: 'Parisienne', cursive;
  background-repeat: no-repeat;
}

.navbar {
  background-color: none;
  width: 100%;
  height: 30px;
  padding-top: 0;
  text-align: center;
}

.navbar a {
  padding: 20px;
  font-size: 2.0em;
  color: black;
  text-decoration: none;
}

.navbar a:hover:not(.active) {
  color: #B22222;
}

.homepage {
  padding-top: 15px;
}

#welcome {
  color: black;
  font-size: 30px;
  text-align: center;
}

#welcome h1 {
  font-size: 50px;
}

＆＃13;

<div class="homepage">
  <div class="navbar">
    <a href="#" class="active">Home</a>
    <a href="#">Schedule</a>
    <a href="#">Accommodations</a>
    <a href="#">Travel</a>
    <a href="#">Activities</a>
    <a href="#">Contact</a>
  </div>
  <div id="welcome">
    <h1>Tracey & Jonathan's Wedding</h1>
    <p>16 / 08 / 2018</p>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

图像位于文件夹中，您必须将路径放到图像中，例如 - background-image：url（文件夹名称/文件夹名称/ homepage1.jpg）; ---文件夹名称将是图像所在文件夹的名称。您也可以这样做--- background-image：url（../ homepage1.jpg）;

这是我添加你的编码时的结果 - 顺便说一句好工作。 这是我的编码来获取这张照片 - background-image：url（images / free％20images / pixabay / faucet-1684902_640.jpg）;

希望这有帮助，如果没有，请告诉我

Answer 2

文件夹结构1

• 的index.html
• homepage1.jpg
• 的style.css

然后背景图片网址

background-image: url("homepage1.jpg");

文件夹结构

• 的index.html
• 图片（文件夹）
  • homepage1.jpg
• 的style.css

然后背景图片网址

background-image: url("images/homepage1.jpg");

文件夹结构2

• 的index.html
• 图片（文件夹）
  • homepage1.jpg
• 样式（文件夹）
  • 的style.css

然后背景图片网址将是

background-image: url(../images/homepage1.jpg");

还要将实际图像名称与背景图像网址进行比较。

Answer 3

查看css文件位置！ 如果它不起作用，请按 F12 并选择控制台然后选择屏幕截图并将其放在此处。

Answer 4

你的＆＃34; homepage1.jpg＆＃34;应该与你的＆＃34; IDontKnowTheName.css＆＃34;在同一个文件夹中。如果不是，您可以将其移动到那里，或者执行＆＃34;子文件夹/子文件夹/....../ homepage1.jpg＆＃34;，或者您可以使用＆＃进入文件夹34; ../&# 34;