[go: up one dir, main page]
Scribd
Upload
138 views11 pages

Lec 18 (HTML DIV+Image)

The div tag is used in HTML to make divisions of content on a web page, such as text, images, headers, footers, and navigation bars. The div tag has opening and closing tags that must be properly closed. Div tags are commonly used by web developers to group HTML elements together and apply CSS styles to multiple elements at once. The img tag is used to display images on a web page and is an empty tag without a closing tag. Images can improve the design and appearance of a web page. Important img tag attributes include src, which specifies the image source, and alt, which provides alternate text for the image.

Uploaded by

Informational Videos
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
138 views11 pages

Lec 18 (HTML DIV+Image)

The div tag is used in HTML to make divisions of content on a web page, such as text, images, headers, footers, and navigation bars. The div tag has opening and closing tags that must be properly closed. Div tags are commonly used by web developers to group HTML elements together and apply CSS styles to multiple elements at once. The img tag is used to display images on a web page and is an empty tag without a closing tag. Images can improve the design and appearance of a web page. Important img tag attributes include src, which specifies the image source, and alt, which provides alternate text for the image.

Uploaded by

Informational Videos
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 11

HTML DIV

HTML DIV
▸ The div tag is known as Division tag. 

▸ The div tag is used in HTML to make divisions of content in the web page like (text,
images, header, footer, navigation bar, etc). 

▸ Div tag has both open(<div>) and closing (</div>) tag and it is mandatory to close
the tag. 

▸ The div tag is generally used by web developers to group HTML elements together
and apply CSS styles to many elements at once.
2
Div Example
<html>

<head><title> Working with DIV </title></head>

<boyd>

<div style="background-color:lightblue">
<h3>This is a heading</h3>
<p>This is a paragraph.</p>
</div>

</body>
</html>

3
DIV Attributes

4
Div Attribute Example
<html>

<head><title> Working with DIV </title></head>

<body>

<div style="background-color:lightblue; align=center; width: 50%">


<h3>This is a heading</h3>
<p>This is a paragraph.</p>
</div>

<div style="width: 960px; color: navy; background-color: pink; border: 2px solid
blue; padding: 5px;">

<p>My fourth webpage!</p>


</div>
</body></html>
5
HTML Image
HTML Image
▸ HTML img tag is used to display image on the web page.

▸ HTML img tag is an empty tag that contains attributes only, closing tags are not
used in HTML image element.

▸ Images can improve the design and the appearance of a web page.

7
img tag Attributes
▸ The src and alt are important attributes of HTML img tag. All attributes of HTML image
tag are given below.

1) src: It is a necessary attribute that describes the source or path of the image.
2) alt: The alt attribute defines an alternate text for the image, if it can‘t be
displayed. The value of the alt attribute describe the image in words. 
3) width: It is an optional attribute which is used to specify the width to display
the image.
4) height: It is used to specify the width to display the image.

8
Img Attribute Example
<html>

<head><title> Working with Image </title></head>

<body>
<img src="C:\Users\ABDULNAVEED\Desktop\a.jpg" height="180" width="300" alt="image">
</body>
</html>

9
img tag as a link
▸ We can also link an image with other page or we can use an image as a link.

▸ To do this, put <img> tag inside the <a> tag.

▸ Example

10
THANKS!
Any questions?

11

You might also like