Почему файл логотипа моего сайта .png не будет отображаться на моем сайте? - PullRequest
Новая
       2

Почему файл логотипа моего сайта .png не будет отображаться на моем сайте?

1 голос
/ 06 мая 2019

Я пытаюсь создать собственный логотип для моего сайта через файл .png, как только я набираю код и тестирую его на локальном хосте, файл не отображает изображение логотипа.

  • Переименование файла .png
  • Проверка орфографии
  • Проверка на заглавные буквы
  • Попытка добавления символа "-" между ними ("holyland-logo.png")
  • Попробовал добавить коричневый цвет ("images / brown-holylandlogo.png") 

<html>

<head>
  <title>HolyLand Souveniers</title>

  <link rel="stylesheet" href="style.css">
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
  <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
  <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>

</head>

<body>
  <div class="top-nav-bar">
    <div class="search-box">
      <img src="images/holylandlogo.png" /> (This is causing the issue)
      <input type="text" class="form-control">
      <!--This is a search box -->
      <span class="input-group-text"><i class="fa fa-search"></i></span>
      <!--Search Icon -->
</body>

</html>

Я ожидал, что логотип появится в левом верхнем углу веб-сайта, но он ничего не делает, он только дает мне X без изображения логотипа .png. Мои пути к файлам и папки, как было запрошено в комментарии

Ответы [ 5 ]

0 голосов
/ 07 мая 2019

вам нужно поместить папку с изображениями в исходные файлы вашего сайта. В противном случае используйте оригинальную ссылку на сайт для изображения

0 голосов
/ 07 мая 2019

Я решил проблему, добавив <img src="holylandlogo.png"> вместо того, что у меня изначально было <img src="images/holylandlogo.png" />, так как у меня был логотип в том же файле.Спасибо за ответ в комментарии, который высказал Эсди.Более подробную информацию вы можете прочитать в посте о том, что я попробовал.

0 голосов
/ 07 мая 2019

Согласно вашему скриншоту, HTML-файл и PNG-файл находятся в одной папке, поэтому путь к файлу указан неверно: в теге img вместо src="images/holylandlogo.png" просто напишите src="holylandlogo.png".

0 голосов
/ 07 мая 2019

Я нажал на вашу публичную ссылку и просмотрел журналы консоли Chrome:

Не удалось загрузить ресурс: сервер ответил с состоянием 404 (не найдено)

для следующих ресурсов:

  • style.css
  • holylandlogo.png
  • favicon.ico

https://apollo.waketech.edu/~smbannoura2/holylandlogo.png показывает изображение, поэтому

<img src="holylandlogo.png">

должно работать для вашей HTML-страницы.

Для style.css и favicon.ico проверьте путь к файлу, как предлагалось в предыдущих ответах

0 голосов
/ 06 мая 2019

Если вы не поставите / в начале URL-адреса изображения (относительный путь), сервер ожидает, что папка с изображениями будет находиться рядом с вашей индексной точкой (index.html / php), но если вы поместите ее вначало (абсолютный путь) он пытается перейти от корня вашего Apache / nginx.Просто для пояснения.

В вашем случае это означает, что вы должны убедиться, что папка с изображениями находится рядом с вашим index.html или index.php.

Другой совет: избегайте пробелов между = в HTML и размещайте свой стиль после внешних стилей на случай, если вы захотите переопределить его части.

Но, пожалуйста, дайте нам больше информации о вашей средетак что мы можем помочь лучше:

  1. Где размещен ваш сайт (локально / провайдер)
  2. Какой URL вы пытались открыть, или файл
  3. Ваша папкаструктура
  4. Ваша настройка (ОС, apache / nginx, PHP ...)
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...