Question

html{
  background-color:#abb2bc;
}

body{
  margin:0;

}
h1 {
  margin:0;
  background-color: #363b42;
}
img{
  width:250px;
}

.navbar{
  text-align:center;
}

.blogpost{
  background-color:white;
  padding:5%;
  margin:3%

}

#blogheader{
  margin-top:15px;
}

.blogimage{
  margin-top:25px;
}

<!DOCTYPE html>
<html>

<head>
  <title>GamingCoachBlog</title>
  <link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>
  <header>
      <div class="navbar">
        <h1>GamingCoach</h1>
      </div>
  </header>
  <main>
    <div class="blogpost">
      <h2 id="blogheader">Recent Blog Posts</h2>
      <a  href="/Users/david/Desktop/Blog/Articles/Ten Fortnite Tips For Season 8/index.html"><img class="blogimage" src="/Users/david/Desktop/Blog/Images/How to get more wins in Fortnite.png" alt="How to get more wins in Fortnite"></a>
    </div>
  </main>
</body>

</html>

我将github存储库连接到我的netlify网站，并且可以正常加载。在我的github存储库中，它有一个images文件夹，但是我的图像无法加载。我也有一个指向图像的链接，该图像具有另一个链接到该文件的html文件，但是每当我单击它时，它都说找不到页面。请说明为什么会这样。

Answer 1

您必须指定要链接的路径，否则它将不知道您要指向的位置。

<!DOCTYPE html>
<html>

<head>
  <title>GamingCoachBlog</title>
  <link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>
  <header>
      <div class="navbar">
        <h1>GamingCoach</h1>
      </div>
  </header>
  <main>
    <div class="blogpost">
      <h2 id="blogheader">Recent Blog Posts</h2>
      <a  href="C:/Users/david/Desktop/Blog/Articles/Ten Fortnite Tips For Season 8/index.html"><img class="blogimage" src="C:/Users/david/Desktop/Blog/Images/How to get more wins in Fortnite.png" alt="How to get more wins in Fortnite"></a>
    </div>
  </main>
</body>

</html>

图片未在netlify上加载并且链接无效

1 个答案: