image is not rendering in navbar - blazor

Question

Hi, I tried to put the image in NavMenu.razor but it's not rendering;

<div class="top-row pl-4 navbar navbar-dark">  
      <img src="~/images/logo3.svg" width="180" height="50" >  
              
    <button class="navbar-toggler" @onclick="ToggleNavMenu">  
        <span class="navbar-toggler-icon"></span>  
    </button>  
</div>  

Have you any suggestions?
Thanks in advance

Answer 1

Have you any suggestions?

Basic troubleshooting? Open the browser's dev tools and look for a 404 error.

If you placed the image in wwwroot/images the proper syntax is...

<img src="/images/logo3.svg" width="180" height="50" >  

Answer 2

As blazor is client based, instead of using ~ to denote the site root, the html base ref is set instead. So all links are relative to wwwroot

https://www.w3schools.com/tags/tag_base.asp