HTML P Element Tutorial

G:hackHTMLmyHTML-Tutorial�9- p element�1.png

Pretty much in every document that you want to display in your webpage, there is a paragraph talking about something. That something might be:

  • your daily life

  • a joke

  • a product

  • advice to a particular group of people

Etc.

The moment you think about adding a paragraph to a webpage, the closest html element that in 90% of time you need to use is <p> element.

In short: We use <p> element when we want to have a paragraph in our webpage.

Example:

<!DOCTYPE html>
<html>
<title> Learning HTML is fun 🙂 </title>
<head>
</head>
<body >
<h1>This is heading h1</h1>
<p>A simple paragraph is comprised of three major components. The first sentence, which is often a declarative sentence, is called the “topic sentence.” It introduces the topic of the paragraph, setting its tone and mood. The next few sentences elaborate, explain, and exemplify the topic introduced in it.</p>
</body>
</html>

One thing you should note is the fact that every time you add a new paragraph using <p> element, the paragraph within this element, will start at a newline just under the element above it.

If you add two paragraphs using two separate <p> elements, the latter will sit under the first paragraph.

Example:

<!DOCTYPE html>
<html>
<title> Learning HTML is fun 🙂 </title>
<head>
</head>
<body >
<h1>This is heading h1</h1>
<p>A simple paragraph is comprised of three major components. The first sentence, which is often a declarative sentence, is called the “topic sentence.” It introduces the topic of the paragraph, setting its tone and mood. The next few sentences elaborate, explain, and exemplify the topic introduced in it.</p>
<h2>This is heading h2</h2>
<p>A simple paragraph is comprised of three major components. The first sentence, which is often a declarative sentence, is called the “topic sentence.” It introduces the topic of the paragraph, setting its tone and mood. The next few sentences elaborate, explain, and exemplify the topic introduced in it.</p>
</body>
</html>