Изображения на моей странице GitHub не загружаются - PullRequest
0 голосов
/ 25 января 2020

В настоящее время я работаю над заданием на главной странице Google в проекте Odin. Я закончил код и зафиксировал все файлы в своем репозитории GitHub на главной странице google, а затем загрузил их на страницы GitHub, чтобы создать сайт через GitHub. Все работает нормально, но изображения не загружаются на сайт.

Я просмотрел форумы по переполнению стека и Odin Project, но не смог найти ответ на мою проблему. На одном форуме говорилось, что GitHub чувствителен к регистру, поэтому я проверил, чтобы мой код был правильным для моих изображений, и даже изменил значение googlelogo_color_.png на googlelogo-color.png и рекомендовал его, чтобы избавиться от подчеркиваний, и ничего не изменилось. Я все еще новичок во всем этом, поэтому я действительно понятия не имею, как работать с GitHub, за исключением того, чему меня научил проект Odin и через форумы. Вот мой репозиторий .

Вот фрагмент моего кода с источниками изображений:

`<div class ="topnavright">
    <li><a href="">Gmail</a></li>
    <li><a href="">Images</a></li>

    <li><img src="/home/ranico/Projects/the_odin_project/google- 
    homepage/googleappsicon.png" width="20" height="20" alt="Google Apps 
    Icon"></li>
    <li><input type="submit" value="Sign in"></li>
</div>
</ul>
</div>

<div class="logosearch">    
<p> 
    <img src="/home/ranico/Projects/the_odin_project/google- 
    homepage/googlelogo-color.png" width="272" height="92" alt="Google Logo"> 
    <br>
    <input>
<p> 
    <input type="submit" value="Google Search">
    <input type="submit" value="I'm Feeling Lucky">
</p></p>
</div>`

1 Ответ

1 голос
/ 25 января 2020

Вам необходимо изменить атрибуты img src в вашем файле index.html, я добавил <!-- Edit Line Below --> комментариев перед строками, которые вы должны редактировать

<!DOCTYPE>
<html>

<head>
  <title>Google Homepage</title>
  <link rel="stylesheet" href="style.css">
</head>

<body>
  <div class="topnav">
    <ul>
      <li><a href="https://about.google/?fg=1&utm_source=google-US&utm_medium=referral&utm_campaign=hp-header">About</a></li>
      <li><a href="">Store</a></li>
      <div class="topnavright">
        <li><a href="">Gmail</a></li>
        <li><a href="">Images</a></li>

        <!-- Edit Line Below -->
        <li><img src="./googleappsicon.png" width="20" height="20" alt="Google Apps Icon"></li>
        <li><input type="submit" value="Sign in"></li>
      </div>
    </ul>
  </div>

  <div class="logosearch">
    <p>
      <!-- Edit Line Below -->
      <img src="./googlelogo-color.png" width="272" height="92" alt="Google Logo"><br>
      <input>
      <p>
        <input type="submit" value="Google Search">
        <input type="submit" value="I'm Feeling Lucky">
      </p>
    </p>
  </div>

  <div class="bottomnav">
    <ul>
      <li><a href="">Advertising</a></li>
      <li><a href="">Business</a></li>
      <li><a href="">How Search works</a></li>
      <div class="bottomnavright">
        <li><a href="">Privacy</a></li>
        <li><a href="">Terms</a></li>
        <li><a href="">Settings</a></li>
      </div>
    </ul>
  </div>
</body>

</html>
...