The HTML paragraph tag: p explained. The paragraph tag

[html]<p>[/html]

lets us make (define) new paragraphs.

Browsers automatically add some space (margin) before and after each element.

The margins can be modified with CSS (with the margin properties).

The opening tag is:

[html]<p>[/html]

and the closing tag is:

[html]</p>[/html]

Everything between the opening and closing paragraph tags:

[html]<p>Hello World!</p>[/html]

is grouped together (in this case Hello World!)

Use a new:

[html]<p>[/html]

tag every time you want a new paragraph.

Look at this example, where we’ve coded two paragraphs:

[html] <body>
<p>Hello world! Paragraph 1.</p>
<p>This is my first webpage. Welcome. Paragraph 2.</p>
</body>[/html]

 

Default CSS Settings for HTML p tag.

Most browsers will display the:

[html]<p>[/html]

element with the following default values:

[html] <!DOCTYPE html>
<html>
<head>
<style>
p {
display: block;
margin-top: 1em;
margin-bottom: 1em;
margin-left: 0;
margin-right: 0;
}
</style>
</head>
<body>

<p>A p element is displayed like this:</p>

<p>This is a paragraph.</p>

<p>Change the default CSS settings to see the effect.</p>

</body>
</html>[/html]

Another Paragraph tag example:

[html] <p>This is the first paragraph of text.
This is the first paragraph of text.
This is the first paragraph of text.
This is the first paragraph of text.</p>
<p>This is the second paragraph.
This is the second paragraph.
This is the second paragraph.
This is the second paragraph.</p>[/html]

The result of the code (above) is displayed below :


This is the first paragraph of text. This is the first paragraph of text. This is the first paragraph of text. This is the first paragraph of text.

This is the second paragraph. This is the second paragraph. This is the second paragraph. This is the second paragraph.


Related Posts:

Learn More about HTML p tag at w3schools.

WordPress, SEO, and Social Media Marketing

The color CSS property

Alignment CSS properties

Using more than one CSS property

What is a Shortcode in WordPress?

MORE CSS PROPERTIES

The background-color CSS property

Building a web page with HTML tags

CSS, HTML, JAVASCRIPT, Online Compiler. Code on the go by replit.it

Build to-do list web-app with code

How to make a Go-Back Input button with inline JavaScript

Introduction to JavaScript – Control Flow: True and False values

Learn RE – Regular Expressions in Python

Introduction to JavaScript – Variables: String Interpolation II

Introduction to JavaScript – Built-in Methods

Introduction to JavaScript – Variables: String Interpolation

CODING WITH CSS: The style attribute

Python Serialization (JSON)

Introduction to JavaScript – Variables: Review

Introduction to JavaScript – Control Flow

Introduction to JavaScript – Create a Variable: const

Introduction to JavaScript

Introduction to JavaScript – Data Types

Introduction to JavaScript – Variables

Introduction to JavaScript – Variables: String Interpolation

 

Connected through code, Choose Your Platform!

About the Author: Bernard Aybout

In the land of bytes and bits, a father of three sits, With a heart for tech and coding kits, in IT he never quits. At Magna's door, he took his stance, in Canada's wide expanse, At Karmax Heavy Stamping - Cosma's dance, he gave his career a chance. With a passion deep for teaching code, to the young minds he showed, The path where digital seeds are sowed, in critical thinking mode. But alas, not all was bright and fair, at Magna's lair, oh despair, Harassment, intimidation, a chilling air, made the workplace hard to bear. Management's maze and morale's dip, made our hero's spirit flip, In a demoralizing grip, his well-being began to slip. So he bid adieu to Magna's scene, from the division not so serene, Yet in tech, his interest keen, continues to inspire and convene.