how to use the image tag in html with example
how to use the img tag in html
HTML Image Tag
✷ <img> tag is use to embed images into web pages. images play an important role in web design.
✷ HTML <img> tag is use embed images webpage.
✷<img> tag is empty or self-closing tag.
✷ image are essential web development as they enhance the visual appeal.
<img> image tag
src source (path or URL) of the image.
alt Alternate text
<img> tag is self-closing tag no need to closing </img>
Syntax
<Img src = "Url">
HTML Image Tag
Attribute
1) Align :-. Top bottom middle left right
Not supported in HTML5 Specifies the alignment of an image according to surrounding element.
2) Alt :- Text
Specifies an alternate text for an image.
3) border :- Pixels
Specifies the width of the border around an image.
4) height :- Pixels
Specifies the height of an image.
5) width :- Pixels
Specifies the width of an Image.
6) Src :- pixels
specifies the URL of an image.
HTML Image Tag
Example
<!Doctype html>
<html>
<Body bgcolor ="blue" text="yellow" link="red" >
<center><h1>photo Art Gallery </h1></center>
<img src="1.jpg" height="100" width="100" align ="left">
<img src="2.jpg" height="100" width="100"align="center" alt ="middle image">
</body>
</html>
HTML Image Tag
Explain Program
Explain Program
Step 1 ]
<!Doctype html>
- <!doctype html> always be the first line of any HTML document.
Step 2 ]
<html> and </html>
html is the root element.
Step 3 ]
<body> and </body>
body is main content area.
All visible content inside to the <body> tagStep 4]
<body bgcolor = "blue" text="yellow" link="red">
bgcolor = "blue" background color page to blue
text = "yellow" sets text on the page yellow
link = "red" color of hyperlinks to red
Step 5]
<center><h1>photo Art Gallery </h1></center>
displays a large heading(<h1>) the text . use photo gallery.
<center> tag centers heading .
Step 6]
<img src =" 1.jpg" height ="100" width ="100" align ="left">
Displays image
file name : 1.jpg
height : 100 pixels
width : 100 pixels
align : left side Step 7]
<img src = "2.jpg" height = "100" width = "100" align = "center" alt = "middle image">
file name: 2.jpg
Height :100
width : 100
align : center
alt : middle image
HTML Image Tag output
Post a Comment