HTML Paragraphs
In this tutorial, we will learn about HTML Paragraphs and their fundamental implementation through examples. In HTML, the <p>
element denotes a paragraph. This element contains both opening and closing tags.
As a result, everything included between <p>
and </p>
is considered as a paragraph. Even if we don't use the closing tag, i.e., </p>
, most browsers will perceive a line as a paragraph, which may result in unexpected consequences. As a result, it is both a good convention and a requirement that we use the closing tag.
Syntax
Key Points: When we glance at the website, we notice there are a few extra spaces before and after each paragraph. HTML is programmed to do this by default. Let's take a look at some of the paragraph tag's properties:
-
As previously stated, the
<p>
tag automatically adds space before and after any paragraph, which is essentially browser margins. - When a user enters numerous spaces, the browser condenses them into a single space.
- When a user enters many lines, the browser condenses them into a single line.
<br> tag
The <br>
element can be used to tell HTML where the browser should modify the lines. There is no closing tag for this tag. As a result, changing the line with a single opening tag is simple.
Syntax
Align attribute
The <p>
element supports the alignment feature and allows us to align our paragraphs to the left, right, or center.
Syntax
<pre> tag
We've seen how the paragraph tag ignores any line modifications and additional spaces within a paragraph, but there's a method to keep this by using the <pre>
tag. It also has a tag for the beginning and a tag for the end. It keeps the extra lines and spaces we use while displaying text inside a specified height and width.
Syntax
FAQs
Yes, you can use other HTML tags inside a <p>
tag. This is known as nested HTML elements (which you learnt about in an earlier lesson). However, it's important to note that some tags, such as the <div>
tag (which you will learn about later), are block-level elements that cannot be nested inside a <p>
tag. It's also important to use nested elements appropriately to maintain the semantic structure of your HTML document. For example, if you want to include a quote within a paragraph, you might use the <blockquote>
tag for the quote and nest it inside a <p>
tag for the paragraph.
Yes, the <p>
tag supports several attributes that can be used to modify its behavior and appearance. The most commonly used attribute is the class attribute, which is used to apply CSS styles to the paragraph. Other attributes include id, title, lang, dir, style, align, etc. This may seem overwhelming right now but you will learn all about these attributes later.