Home / Tutorial / Div and P Tag In HTML | One Mistake Every Web Designer Does !

Div and P Tag In HTML | One Mistake Every Web Designer Does !

HTML TagsIn HTML there are many tags which are used to display on the website structure but the widest tags are used in both HTML4 and HTML5 are div and p tags. These tags are used to represent the content on the web page but there is a slight difference between two of them Lets First Discuss The Div And Paragraph Tags In HTML. <div> Tag in HTML is basically the divide tag but what it does? it divides the page for example if we use this <div> tag like this

 

 

 

How To Use <div> Tags In HTML

<!DOCTYPE html>
<html>
<head>
<title> My First Page </title>
</head>
<body>

<div> Div Tag Divides The Structure </div>

</body>
</html>

We can use the div tag to divide the structure of the page here is the example which you see above. Now div tags and can be used in many different ways which will be discussed later. We can create multiple divs on the page it depends on our requirement for example:

<!DOCTYPE html>
<html>
<head>
<title> My First Page </title>
</head>
<body>

<div>My First Div</div>
<div>My Second Div</div>
<div>My Third Div</div>

</body>
</html>

There are three divs which are created in the example above. Similarly, we can create multiple divs like this.

How To Use <p> Tags In HTML

The paragraph tag in HTML is used for creating the paragraph in HTML. If we want to use the <p> tag. Here is the example for creating a paragraph tag in HTML

<!DOCTYPE html>
<html>
<head>
<title> My First Page </title>
</head>
<body>

<p> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries </p>

</body>
</html>

We Can also create multiple paragraphs On The web page like the <div> tag.

<!DOCTYPE html>
<html>
<head>
<title> My First Page </title>
</head>
<body>

<p> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries </p>

<p> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries </p>

</body>
</html>

 

The output of the <div> tag and the <p> tag is the same but when it comes to the difference between both of them there is one. The difference is when we create multiple paragraphs it adds one line space  but when we create multiple div it does add one line space after one div

Do you need a Web Designer For Your Product?

Web Designer For Your Product

 

 

About tayyab_no_access

Check Also

Getting Started With HTML | How To Create A WebPage In HTML

Getting Started With The HTML. First, we need to understand what is HTML. HTML is

Leave a Reply

Your email address will not be published. Required fields are marked *