HTML Paragraphs
An HTML paragraph (<p>
) element is used to define a block of text or content within a webpage. A paragraph always starts on a new line.
HTML paragraph or HTML <p> tag is used to define a paragraph in a webpage. Let’s take a simple example to see how it work.
Example:
<!DOCTYPE html>
<html>
<body>
<p>This is first paragraph.</p>
<p>This is second paragraph.</p>
<p>This is third paragraph.</p>
</body>
</html>
Output:
Note : Browser automatically adds a extra blank line after each paragraph(<p>) tag.
HTML Paragraph desplay
- In HTML paragraph, you cannot change the display by adding extra spaces or extra lines in your HTML code.
- The browser will automatically remove any extra spaces and lines when the page is displayed.
- The browser counts number of spaces and lines as a single one.
Examples:
<!DOCTYPE html>
<html>
<body>
<p>
It is a paragraph
with multiple
lines to show the
examples.
</p>
<p>
This paragraph
has a lot of spaces
in the this code,
but the browser
considering it as single space.
</p>
</body>
</html>
Output:
HTML <pre> Element:
The HTML <pre>
element defines preformatted text. The text inside a <pre>
element is displayed in as it is preserves both spaces and line breaks.
Example:
<!DOCTYPE html>
<html>
<body>
<h2> This is example of pre tag.</h2>
<pre>
This is my world.
I love this world.
You should also love this world.
Ok this is fine .
</pre>
</body>
</html>
How to Use <hr> and <br> tag with paragraph?
- An HTML <br> tag is used for line break and it can be used with paragraph elements. Use
<br>
if you want a line break (a new line) without starting a new paragraph: - An HTML <hr> tag is used to apply a horizontal line between two statements or two paragraphs.
Example:
<!DOCTYPE html>
<html>
<body>
<h2> This is example of br tag.</h2>
<p>The world is in danger.
<br>We have to save our life.
<br>peoples are only enjoing thier life.
</p>
<h2> This is example of hr tag.</h2>
<p>The world is in danger.
<hr>We have to save our life.
<hr>peoples are only enjoing thier life.
</p>
</body>
</html>