Почему мой логотип не отображается на панели навигации, но другой логотип есть?

#html #css

#HTML #css

Вопрос:

Я пытался создать панель навигации, но когда я загружаю свой веб-сайт в localhost, я, кажется, не вижу своего логотипа на панели навигации. Поэтому я поискал в Интернете пример, чтобы понять, был ли проблемой мой логотип. В этом первом примере (взятом из Интернета, я вижу, как загружается их логотип)

     *{transition:all 0.3s ease-in-out;}
    
    .container{
      clear:both;
      overflow:auto;
    }
    
    nav{float:right;}
    
    .logo img{float:left;}
    
    ul li{
      display: inline-block; padding:10px;
      font-size:20px; font-family:raleway;
    }
    
    ul li:hover{
      color:orange;
      
    }  
     <div class="container">
    <div class="logo">
      <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/c/c9/Intel-logo.svg/2000px-Intel-logo.svg.png" alt="" width="130"/>
      </div>
    <nav>
      <ul>
      <li>Home</li>
      <li>Services</li>
      <li>Products</li>
      <li>Clients</li>
      </ul>
      </nav>
    </div>
    <hr />  

Затем все, что я сделал, это поместил прямую ссылку на мое изображение imgur, чтобы заменить их логотип моим, и когда я загружаю его, он не отображается. Как же так?

     *{transition:all 0.3s ease-in-out;}
    
    .container{
      clear:both;
      overflow:auto;
    }
    
    nav{float:right;}
    
    .logo img{float:left;}
    
    ul li{
      display: inline-block; padding:10px;
      font-size:20px; font-family:raleway;
    }
    
    ul li:hover{
      color:orange;
      
    }  
 <div class="container">
    <div class="logo">
      <img src="https://i.imgur.com/jSo9sj9.png" alt="logo" width="130"/>
      </div>
    <nav>
      <ul>
      <li>Home</li>
      <li>Services</li>
      <li>Products</li>
      <li>Clients</li>
      </ul>
      </nav>
    </div>
    <hr />  

Спасибо за вашу помощь.

Комментарии:

1. У меня в Chrome все работает именно так, как у вас.

2. Попробуйте очистить кеш и перезагрузить

3. Хорошо, значит, проблема с моей стороны? Довольно странно, как их логотипы отображаются, а не мои для меня.

4. Работает нормально для меня и отлично работает во фрагменте кода.

Ответ №1:

Я поместил его в элемент body и избавился от </hr> , и он работает у меня. введите описание изображения здесьвведите описание изображения здесь

Это также работает на jsfiddle.net . введите описание изображения здесь

Комментарии:

1. Тогда проблема определенно с моей стороны, потому что я пробовал с вашим кодом, и я все еще его не вижу :/

2. я пробовал с pycharm и скобками, одинаковый результат для обоих.

3. Мое единственное предположение, возможно, imgur заблокирован антивирусным фильтром?