HTML external link working but image src not - html

I am using external links for some images in my app. Links are ok, anchor tag works and it moves me to the exact raw image. The issue is that src of the image display broken image link icon;/
<img src="#img.Url" loading="lazy" style="max-width: 80%">
Image Original Link
Could someone help me?

Related

<img src> tag help - learning blazor

I am learning Blazor and at the moment I am trying to set an image as the background. I thought I would try display it first as the background-image css didnt work. I have attached a picture of my index.razor page and the img tag i am using is as follows:
<img src="file:///C:/Development/CsharpApplications/Portal/AlbertBartlettPortal/AlbertBartlettPortal/Pages/hero-range-1.jpg" alt="Background Image" />
It allows me to ctrl+click the file path and opens the image right away so it can see the image, but it wont display at all when the website is ran.
HELP!
Page Image Here
I put it in wwwroot\images and then used src="images/aaa.jg". No leading / OR ~/

My image is not displayed and the alternative is displayed

I am trying to build a portfolio website, with a moving gallery but the image is not displayed, it shows the alternative image instead. Any help is appreciated.Here is the code:
<div class="section1">
<img class="imgr"src="photo_1.jpg" alt="nothing">
</div>
I even copied the relative path from Vscode, but it is still not working.
It must be the path to the image. Try replacing "photo_1.jpg" with "./photo_1.jpg".

Loading .png images works but .gif doesn't in thymeleaf

I use this code to load png images and it always work:
<img src="cid:gamze.png" alt="mail-icon" width="110" height="110" border="0"/>
I want to load gif images the same way but it doesn't.
Here is the png and gift path ;
project > src > resource > mail > img
Could you help me?
Thanks in advance
note : There is a link for this situation but 6 years ago.
Gif image not working in thymeleaf-html page?
I am able to use both .png and .gif in my code using below line
<img th:src="#{/image/2.gif}" alt="mail-icon" width="110" height="110" border="0"/>
Please inspect your generated html and verify the gif image is present at link as in src of img

image not displaying in webpage, but link to image works

Im building a webpage and have the following code in the page:
<img alt="chat" href="images/chat.jpg">Chat now
The image "chat.jpg" is in the images folder, which is in the same folder as index.html, and if i browse to "localhost/site/images/chat.jpg" it displays but it doesnt show up in the index page at "localhost/site/index.html".
I have tried changing the href to "/site/images/chat.jpg" and the same thing happens.
There is no href attribute for img elements. You are looking for the src attribute.
Validators are useful tools.
This will work for your problem.
<img alt="chat" src="images/chat.jpg">Chat now

ID tag link not working

My website: cultpops.com
I'm trying to get the top left logo on my site to link to the 'about' portion on my page. As per another stackoverflow topic, I placed [a href="#about"][/a] around said logo and [a id="about"][/a] around said portion. What am I missing here?
I see you really put [a id=”about”] in your code. This is not an html tag. html tags always are like this <htmltag> and not with square brackets
If you want to link to an anchor you just need to give an id to the html element you want (doesn't have to be an <a> tag).
The easiest way to do this is for example on the image above your about section.
Set your editor to text instead of visual and add an id to your image or the a tag around it. It will look like this.
<a href="http://www.cultpops.com/wp-content/uploads/2015/05/logo21.png" id="about">
<img class="alignnone size-full wp-image-97" src="http://www.cultpops.com/wp-content/uploads/2015/05/logo21.png" alt="logo2" width="97" height="133">
</a>
Place the following around the "img src="example.com/image.png" tag:
<a href="http://example.com/youraboutpage">
<img src="example.com/image.png">
</a>
I can see you are using wordpress -the logo image tag is in your header.php file available in Appearance>Editor
Hope this helps
Admin Alex