What Tag Is Used to Display a Picture in a HTML Page?
FREE
Build an AI-First Career, Master the Complete Skillset
Choose from our industry-leading programs designed for career success
Modern Software and AI Engineering Program
Master full-stack development with AI integration
+1000 moreModern Data Science and ML with specialisation in AI
Advanced data science techniques with AI specialization
+1000 moreAdvanced AIML with Specialisation in Agentic AI
Deep dive into AIML with focus on Agentic systems
+1000 moreDevOps, Cloud & AI Platform Engineering
Build and manage AI-powered cloud infrastructure
+1000 moreAI Engineering Advanced Certification by IIT-Roorkee
Premier AI engineering certification from IIT-Roorkee
AI Forward Deployed Engineer Program
Full-stack engineering, production AI and client-facing consulting
+1000 moreOverview
Images can be displayed on an HTML page with the help of the <img> tag. Images are not directly inserted into an HTML page but are instead embedded on the HTML and linked to the webpage through a url which the browser interprets and loads the image when the HTML is parsed. The <img> tag creates a holding space for the image to be inserted. It is an empty tag with two attributes and no closing tag.
The two attributes of the <img> tag are: src: It specifies the path or url to the reference image alt: It specifies an alternate text for the image
The <img> page may also take other attributes like style or width and height for specifying the size of the image to be displayed.
Syntax
The general syntax to embed an image in HTML is as follows:
We may also use attributes like style or width and height as follows:
Adding an Image to a Website
The following examples describe the use of the <img> tag to add images to a HTML website:
Here, we add an image in between two divs. We have sourced the image from an external website, the link to which is specified within the src attribute of the <img> tag.
Output:
We may also use a local address to display an image in the image source instead of using a URL. This is used in cases where the image is stored within the user's system, for example,
Output:
As mentioned previously in the article, we may also use the style or height and width attributes to change the image size as in the following examples. Both the codes below provide the same output:
Output:
How Scaler Transformed Careers in Different Fields
Scaler learners achieved 2.5x salary growth with average post-Scaler CTC reaching ₹23L.
Google
Amazon
Microsoft
Flipkart
Adobe1200+ moreSupported Browsers
The <img> tag was first used in the web browser NCSA Mosaic which was launched in 1993. It was eventually included with the HTML 2.0 specifications released in 1995 by W3C and as such, is supported by most browsers running with HTML 2.0 specifications and higher. This includes popular browsers like Google chrome, Internet Explorer, Safari, Mozilla Firefox, etc.
Conclusion
- The <img> tag is used to display picture in an HTML file
- The <img> tag takes the src attribute alongwith alt, style or height and width attributes.
