CODEWITHSUNDEEP
htmlcss
Gavin Niu
Gavin Niu

Reputation: 1335

Can not see logo in navbar

I saw question about how to add logo to navbar and I tried this 

<a href="#" class="pull-left"><img src="C:/Users/s003/Documents/Visual Studio 2013/Projects/Model/LOGO.png"></a>

I have already download the picture LOGO.png, and the path I input is where I put that picture. However when I open the web, instead of the LOGO, there is a broken picture icon showed in navbar. Is there anything wrong with my code? I have tried different pictures. Thanks for your help

<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
       <div class="navbar-header">
         <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>

         </button>
             <a href="#" class="pull-left"><img src="file://localhost/c:/Users/LOGO.png"></a>
             <a class="navbar-brand" runat="server" href="~/">Science</a>
             </div>

Upvotes: 0

Views: 2438

Answers (1)

Antony
Antony

Reputation: 512

I assume you are viewing your webpage using localhost.(Visual studio server, or apache etc.)

Browsers do not load local file by default due to security reason.

You have to use file path relative to the html file like: ../path/to/images/ or absolute path \path\to\images

You cannot use windows path when viewing pages through server

But if still want to load local files, there are workarounds for every browsers.

For chrome: google allow file access

Example:

Lets assume this is your project path. C:/Users/s003/Documents/Visual Studio 2013/Projects/Model/

looking at your image path, LOGO image is in the root folder of project i.e Model.

if your html file is also in the same directory, you just have to use

suppose your image file is inside images folder in model folder, then you have to use

and suppose you html file is inside some view folder in model folder, then (../ to go up one directory)

Upvotes: 1

Related Questions