0

I want to insert several online images into my HTML file. If I click the URL inserted, I can see images. However, when the URL is in src, no image would appear.

I tried to use local images, however, I used a flask template, the local file wouldn't display either (the relative path is correct since if I use the path in a simple HTML file without the template, everything is just fine).

<div class="container">
 <div class="starter-template">
   {% if map == 'Erangel' %}
    {% if item == 'Beryl M762' %}
      <img src="" alt="Sanhok">
    {% endif %}
   {% endif %}
 </div>
</div>

How can I insert my images successfully?

zty001
  • 1
  • 1
  • when you inspect the image element from your browser, is the url there? – Félix Paradis Apr 16 '19 at 01:32
  • Yes, the url is there. If I click the url before I open my html, I can see the image loading correctly. I just sent my code to my teammate, she didn't click the url before, in her browser, no image will show up. If she click the url, she can see the image as well – zty001 Apr 16 '19 at 01:36
  • Could the image be invisible because of some CSS then? – Félix Paradis Apr 16 '19 at 02:04
  • Possible duplicate of [how can I show webp image format in HTML](https://stackoverflow.com/questions/44918470/how-can-i-show-webp-image-format-in-html) – Kamalesh M. Talaviya Apr 16 '19 at 04:53

2 Answers2

0

I think you should try inserting some other content along with the image such as <p></p> and check if that is visible. It might be the case that your if check are false and the code is not executing.

Al Amin
  • 889
  • 7
  • 12
0

Add a line of 

<meta name="referrer" content="never">

will solve the problem.

When the browser uses the URL in the source, it'll automatically add a request 'refer' to it, some website will block any request of 'refer'.

zty001
  • 1
  • 1