Loading Please Wait...
Like Headings, paragraph work as a block of text which always start from the new line. When the browser detects a paragraph, it adds some white space (margin) before and after the paragraph.
In HTML, paragraphs are defined by the <p> element/tag.
<!DOCTYPE html>
<html>
<body>
<p>Some paragraph</p>
<p>Another paragraph</p>
</body>
</html>
The paragraph view is controlled by the browsers. We can never be sure how it is going to display on the browser window.
Different screen devices, display the paragraph differently and resize it accordingly.
Suppose we add some extra space and a new line in our code.
The browser will automatically remove extra space or new line when it renders the paragraph.
<!DOCTYPE html>
<html>
<body>
<p>
This is some paragraph with
new line in the HTML code but the browser
ignore/remove it.
</p>
<p>
This is some paragraph with
lots of space in the HTML code but the browser
ignore/remove it.
</p>
</body>
</html>
What if we want to add some extra space and new lines in your paragraph?
In such situation, we can use <pre> element (preformatted text).
<pre> element preserve the space and new lines. The formatting for <pre> element is set by the browser but we can change it.
<!DOCTYPE html>
<html>
<body>
<pre>
This is some paragraph with
new line in the HTML code but the browser
ignore/remove it.
</pre>
<pre>
This is some paragraph with
lots of space in the HTML code but the browser
ignore/remove it.
</pre>
</body>
</html>
<br> element is used to define a line break in HTML. It is an empty tag (no closing tag required).
With the help of <br> tag, we can starting new line without using another paragraph.
<!DOCTYPE html>
<html>
<body>
<p>
This is line 1 <br>
This is line 2 <br>
This is line 3
</p>
</body>
</html>
<hr> element is used to define a thematic change, normally displayed as a horizontal rule. This is an empty tag.
It is used to separate content or define change in HTML document/page.
<!DOCTYPE html>
<html>
<body>
<p>Paragraph 1</p>
<hr>
<p>Paragraph 1</p>
</body>
</html>
How you feel about this blog:
Share this blog on:
If you find any error in the turtorials, or want to share your suggestion/feedback, feel free to send us email at: info@lynxsia.com
Contact UsWe are concern with various development process like website design & development, E-commerce development, Software development, Application development, SMS & Bulk SMS Provider, PWA Development, and many more..
Copyright ©
, Lynxsia IT Solutions, All rights reserved