html img src

<img src="smiley.gif" alt="Smiley face" height="42" width="42">

View another examples Add Own solution

Teraschi 85 points

                                    &lt;img href=&quot;https://website.com/image.jpg&quot;&gt; 
&lt;!-- for an image online --&gt;

&lt;img src=C:\your_files&gt;
&lt;!-- for a local file --&gt;

Thank you! 1

3 (1 Votes)

Asfallows 100 points

                                    &lt;head&gt;
&lt;title&gt;Image Upload&lt;/title&gt;
&lt;style&gt;
  body {
    margin:0px;
  }

  .center {
    display:inline;
    margin: 3px;
  }

  .form-input {
    width:100px;
    padding:3px;
    background:#fff;
    border:2px dashed dodgerblue;
  }
  .form-input input {
    display:none;
  }
  .form-input label {
    display:block;
    width:100px;
    height: auto;
    max-height: 100px;
    background:#333;
    border-radius:10px;
    cursor:pointer;
  }

  .form-input img {
    width:100px;
    height: 100px;
    margin: 2px;
    opacity: .4;
  }

  .imgRemove{
    position: relative;
    bottom: 114px;
    left: 68%;
    background-color: transparent;
    border: none;
    font-size: 30px;
    outline: none;
  }
  .imgRemove::after{
    content: ' \21BA';
    color: #fff;
    font-weight: 900;
    border-radius: 8px;
    cursor: pointer;
  }
  .small{
    color: firebrick;
  } 
  &lt;/style&gt;

&lt;/head&gt;

&lt;body&gt;

   &lt;div class=&quot;image-upload-one&quot;&gt;
     &lt;div class=&quot;center&quot;&gt;
       &lt;div class=&quot;form-input&quot;&gt;
         &lt;label for=&quot;file-ip-1&quot;&gt;
           &lt;img id=&quot;file-ip-1-preview&quot; src=&quot;https://i.ibb.co/ZVFsg37/default.png&quot;&gt;
           &lt;button type=&quot;button&quot; class=&quot;imgRemove&quot; onclick=&quot;myImgRemoveFunctionOne()&quot;&gt;&lt;/button&gt;
         &lt;/label&gt;
         &lt;input type=&quot;file&quot;  name=&quot;img_one&quot; id=&quot;file-ip-1&quot; accept=&quot;image/*&quot; onchange=&quot;showPreviewOne(event);&quot;&gt;
       &lt;/div&gt;
       &lt;small class=&quot;small&quot;&gt;Use the &amp;#8634; icon to reset the image&lt;/small&gt;
     &lt;/div&gt;
   &lt;/div&gt;
    
  &lt;script&gt;

    function showPreviewOne(event){
      if(event.target.files.length &gt; 0){
        let src = URL.createObjectURL(event.target.files[0]);
        let preview = document.getElementById(&quot;file-ip-1-preview&quot;);
        preview.src = src;
        preview.style.display = &quot;block&quot;;
      } 
    }
    function myImgRemoveFunctionOne() {
      document.getElementById(&quot;file-ip-1-preview&quot;).src = &quot;https://i.ibb.co/ZVFsg37/default.png&quot;;
    }

  &lt;/script&gt;
   
&lt;/body&gt;

Thank you! 0

4.5

SweetSweet 80 points

                                    &lt;img src=&quot;the source image's url&quot; alt=&quot;the image's description&quot;&gt;

Thank you! 4

4.5 (4 Votes)

Annabel Lee 100 points

                                    &lt;img src=&quot;image.jps&quot;&gt;
//image.jpg is where you would put the inage source.

Thank you! 6

4 (6 Votes)

4.5

Janki Desai 60 points

                                    &lt;img src=&quot;https://source.unsplash.com/user/c_v_r&quot; alt=&quot;Unsplash&quot; alt=&quot;This is the alt&quot; height=&quot;42&quot; width=&quot;42&quot;&gt;

Thank you! 6

4.5 (6 Votes)

Are there any code examples left?

Find Add Code snippet

New code examples in category Html

Html 2022-03-27 21:55:05 how to kill html
Html 2022-03-27 21:55:02 How to create web urls without extensions
Html 2022-03-27 21:45:11 space between 2 h tags without break
Html 2022-03-27 21:40:13 how to resize submit button in html
Html 2022-03-27 20:40:18 https://www.codegrepper.com
Html 2022-03-27 19:55:09 show image inside table with innerhtml
Html 2022-03-27 19:30:47 html email input
Html 2022-03-27 18:45:01 how to add favicon in html
Html 2022-03-27 18:15:21 picture html
Html 2022-03-27 18:15:11 ex: javaasdasdasdasd

Create a Free Account

Unlock the power of data and AI by diving into Python, ChatGPT, SQL, Power BI, and beyond.

Develop soft skills on BrainApps

Complete the IQ Test

Relative searches

html img src

Welcome Back!

Create a Free Account