Whenever one wants to write regular content on a page, the best element available in HTML is the p tag. This element is a block level element.
The "p" element
Before explaining anything about this element, have a look at the below example.
1<p>This is paragraph written under p tag og HTML.</p> 2
The p element signifies the regular text on the web page. it is a block level element which means that this element takes up whole line width from left most to the right most of the screen no matter the content ends in the middle of the line. This means that any new element that one would write subsequent to this element will appear on the new line. Similarly, this element, itself, also always starts with a new line unless, it is styled otherwise.
The syntax as can be seen from above quite simple. One just has to write an opening tag i.e. <p>, write some content and then close the tag with a closing tag i.e. </p>.
Whitespace in "p" tag
When writing content inside a p element, the browser, by default removes any leading spaces from the start and end of the tag. It can best seen from the example below:
1<p> This is a paragraph with leading spaces. </p> 2
The output of the above line will not result in spaces from the start and end of the content but rather it will start from the left most of the element.
Further, if one puts more than one space between two characters / words, the browser will also remove all of the additional spaces except for one space. The below code will simply have one space between each character no matter how many spaces are entered in the code.
1<p>This is a paragraph with leading spaces.</p> 2
Line-breaks in "p" tag
When writing content inside a p element, the browser, by default removes any line-breaks and replace them with a single space between the characters where line breaks were entered. It can best seen from the example below:
1<p>This 2 is 3 a 4 paragraph 5 with 6 line 7 breaks.</p> 8
The output of the above line will not result in line-breaks after each word where line-breaks were entered but rather, entire text will be shown on a single line with one space between characters where line breaks were entered.
To make browsers accept above line breaks, a different tag is used i.e. pre which will explained in some later article.
Conclusion
The points to remember mentioned in this post are as follows:
- Whenever, one wants to display some regular content on a web page, use the p tag.
- The paragraph element is a block-level element meaning it takes the entire row space on a page.
- Whitespace and line-breaks are not taken into account by browsers. Rather, only one space between the two characters is accepted and displayed.
- Leading spaces at the beginning or at the end of content in the p tag are not completely removed by browsers.