7/3/20

HTML IMAGES :- INSERT AN IMAGE IN HTML DOCUMENT


HTML IMAGES

Images are very important for any website. Think there is a webpage that does not have a single image in it. How will you feel? It will not be good to read at all. Images help the website to become more attractive to visitors.

Leave it to the visitor. If you also visit any website. To read any topic. There is not a single image appear in that website, only the text is written, so how would you feel that you would think that it would be better to read from a book or read from another website.

In today's time, no one spends his time studying, everyone wants to learn by watching. Why would you waste your time reading the topics that you can teach through images? That’s why nowadays YouTube and online teaching is so popular.

Back to the topic, if you want to add images on your Html webpages an Html element <img> is used with src attributes.

Example:-

<img src = “ address of the image”> 


Example:-

<html>
<head>
<title> Example of Links </title>
</head>
<body>
<img src = "C:\Users\Mad About Computer\Downloads\image.jpg">
</body>
</html>


Output:-




The SRC Attribute

The src attribute is used to give the address or URL of the image which you want to insert on your webpage.

src = “ Address of the Image ”

The Alt attribute

The alt attribute is used when your image doesn’t load or show on your Html webpage. Sometimes images may not load on the browser because of slow connection, a slow server, or wrong URL of images. The alt attribute shows an alternate text for images.

Example:- 




IMAGE SIZE:- HEIGHT AND WIDTH

So far we have seen how to insert an image on our HTML page. Now, suppose if you want to insert an image but the size of the image you have selected is very large, but you have to bring it in a small form on your webpage. What will you do for him?  For that, we will use the CSS style attribute. You can choose the height and width of your image by yourself.
To specify the height and width of the image use style attribute.

Example:- 


<html>
<head>
<title> Example of Links </title>
</head>
<body>
<img src = "C:\Users\Mad About Computer\Downloads\image.jpg" alt = "This is a HTML Image" style ="height:200px; widht:200px;" >
</body>
</html>

Output:-



That’s it for today guys In this article, you learned about HTML IMAGES. If you have any queries regarding this article you can comment on it or DM on my social media account. If you like the article you can share it with your friends or relatives.  See you in the next articles.

Thanks for visiting here

Have a Good Day.

PEOPLE ALSO READ:- HTML LINKS : ( Visited, Unvisited, Images as a Link )
PEOPLE ALSO READ:- HTML COMMENTS:- Single line and Multiline


"+y+""}else{if(A==5){c+='
  • '+w+""+y+"
  • "}else{if(A==6){c+='
  • "+w+'
    '+u+""+y+"
  • "}else{c+='
  • "+w+"
  • "}}}}}s.innerHTML=c+=""+y;d.callBack()};randomRelatedIndex=h;showRelatedPost=g;j(d.homePage.replace(/\/$/,"")+"/feeds/posts/summary"+e+"?alt=json-in-script&orderby=updated&max-results=0&callback=randomRelatedIndex")})(window,document,document.getElementsByTagName("head")[0]); //]]>

    0 comments:

    Post a Comment

    Follow on Twitter

    Linkedin

    Categories

    Blog Archive

    Mad About Computer. Powered by Blogger.
    This site is in no way affiliated with or endorsed by specified business. It exists as a compendium of supporting information intended for informational purposes only. If you want to buy this website, please don't hesitate to contact us via e-mail: "d e n a c c 9 7 7 (at) g m a i l (dot) c o m" (delete spaces) or you can find and buy it on Afternic domain auctions.