How To Add HTML Paragraphs Tag

Sharing is healthy !!

Hello everyone!! This post is on how to add html paragraphs tag.

Here we are going to talk about the fact that for paragraph tag does not show the formatting in your web browser the way that you format it in your html vacuuming unless you use the proper markup tags to resemble. Before many, i’ll show you exactly what i mean as we progress through this post. So, let’s go ahead and get started.

Paragraphs – How To Add HTML Paragraphs Tag

Also Read – Hover HTML Example

<!DOCTYPE html>
<html>
<head>
<title>Flower Brackets - code here</title>
<meta charset="UTF-8"> 
</head>
<body>

<p>A simple paragraph.</p>
<p>Second simple paragraph.</p>

</body>
</html>

Output:

A simple paragraph.

Second simple paragraph.

In the above example, as you can see, browser will naturally add margin space before and after paragraph.


discard extra spaces

<!DOCTYPE html>
<html>
<head>
<title>Flower Brackets - code here</title>
<meta charset "UTF-8"> 
</head>
<body>

<p>
A simple paragraph. 
with many lines, 
browser will discard 
it.
</p>

<p>Second simple paragraph with too many spaces even this
paragraph will be
discarded.
</p>

</body>
</html>

Output:
A simple paragraph. with many lines, browser will discard it.

Second simple paragraph with too many spaces even this paragraph will be discarded.

Above example we added many spaces in between words but browser discarded it. Basically in HTML spaces and new lines are discarded. The number of lines in a paragraph is directly proportional to size of the browser. Try resizing this window to see more number of lines in paragraph element.


line breaks and <pre> element

Also Read – HTML Basic

<!DOCTYPE html>
<html>
<head>
<title>Flower Brackets - code here</title>
<meta charset = "UTF-8"> 
</head>
<body>

<p>
A simple paragraph.<br> 
with many line breaks,<br> 
browser will not discard<br> 
it.
</p>

<p>pre tag example.</p>

<pre>

example on pre tag.
 
Flower Brackets is a website.

You can learn html with examples.

</pre>

</p>

</body>
</html>

Output:


How To Add HTML Paragraphs Tag

Note:
  • <p> element defines paragraph.
  • <p> element produce different results when we open a website in laptop and mobile.
  • Do not add extra spaces in between paragraph element, that is, in between <p> and </p>.
  • Do not forget to close paragraph element. Most of the browsers will display properly but it is not a good programming practice and it will lead to serendipitous errors.
  • <br> element is defined as line break. It is an empty tag, meaning, no closing tag.
  • <pre> element is nothing but preformatted text. This tag maintains space as well as line breaks between paragraph element.
Sharing is healthy !!

Leave a Reply

Your email address will not be published.