how to use div tag in html and css with examples
Tamizh Tech Tutorial
................
- div stands for division and it is a type of container tag
- It is mainly used to create a division or section in HTML page
- It is styled easily by using its tagname or class or id attribute.
Syntax
<div>
</div>
I. EXAMPLE OF CREATING RECTANGULAR SHAPE USING <DIV> TAG
NOTE
- In order to create a square shape, the height and width attributes should be equal size.
1. SOURCE CODE
<html>
<head>
<title>TODO supply a title</title>
<style>
div
{
border: 4px double black;
width: 300px;
height:300px;
padding:9px;
background-color: #6639b7;
color:white;
border-radius: 5px;
}
p
{
font-size: 21px;
}
</style>
</head>
<body>
<div>
<p>Hello World</p>
</div>
</body>
</html>
2. OUTPUT
II. EXAMPLE OF CREATING CIRCLE SHAPE USING <DIV> TAG
NOTE
- In order to create a circle shape, the height and width attributes should be equal size and border radius should be 50 %.
1. SOURCE CODE
<html>
<head>
<title>HTML Div Tag</title>
<style>
div
{
width: 350px;
height: 350px;
background-color: #205081;
color:white;
padding: 9px;
border: 4px solid red;
border-radius: 50%;
}
</style>
</head>
<body>
<center>
<div>
<h3>Welcome</h3>
<p>Test</p>
</div><br>
</center>
</body>
</html>
Comments
Post a Comment