A paragraph is a sentence or group of sentences referring to the same topic. Anything between the <p> and </p> tags will be considered as a paragraph by the browser.
Example
<p>This is a paragraph</p>
<p>This is another paragraph</p>
<p> is a block-level element, the Browsers automatically add blank lines before and after paragraphs.
Don't forget the closing tag
Even if you forget to use the closing tag, most browsers will display the HTML correctly:
<p>This is a paragraph
<p>This is another paragraph
The above example will work fine in most browsers, but don't rely on this practice. Forgetting to use closing tags can produce unexpected results and errors.
Let's take Example:
If you want to display an article on the web page, you need the <p> tag to put the paragraphs of the article.
Each paragraph goes in <p> tag, If there are 3 paragraphs of text in a news article, put these 3 paragraphs into 3 <p> tags respectively. As shown below.
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>HTML Paragraph - coding180.com</title>
</head>
<body>
<p>Two people have been rescued after a small plane crashed into
a power line tower in Maryland, leaving the two
occupants
dangling about 100 feet in the air for hours. The crash
knocked out power to thousands of people in the area for
much of
the evening.
</p>
<p>
A single-engine Mooney M20J crashed into Pepco tower lines
near Montgomery County Airpark in Gaithersburg,
Maryland,
around 5:40 p.m. local time Sunday, according to the Federal
Aviation Administration.
</p>
<p>
Maryland State Police identified the occupants of the plane
as pilot Patrick Merkle, 65, of Washington, D.C.,
and
passenger Jan Williams, 66, of Louisiana. The two were rescued
roughly seven hours later, with Williams being
brought
down from the plane first, followed shortly after by Merkle.</p>
</body>
</html>
Result in the browser:
<p>The default style of the label can be seen in the figure above. There will be blanks before and after the paragraph. If you don’t like this blank, you can delete or change it with css style, which will be learned in the following courses.
Tip: To remember the name of this HTML element:
<p> comes from the word paragraph
Task:
- Enter in line 10: <p>My first paragraph. </p>
- Enter in line 11: <p>My second paragraph. </p>
Task code:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>p tag</title>
</head>
<body>
</body>
</html>
