AI Reading
Quick summary of this article
The HTML <p> tag defines a paragraph as a block-level element, meaning it starts on a new line and takes up the full width available. Browsers typically add spacing above and below paragraphs, and these tags should not contain other block-level elements like <div>, headings, or another <p> tag to maintain valid HTML structure.
- Use the
<p>tag to group sentences into meaningful blocks of text. - Paragraphs automatically include top and bottom margins in most browsers.
- Do not nest block-level elements like
<div>,<h1>, or another<p>inside a paragraph. - Place each paragraph in its own separate
<p>tag for correct layout. - Nesting a
<p>inside another<p>creates invalid HTML and can break your page.
📝 Chapter 7: Using the <p> Tag in HTML
The <p> tag in HTML is used to define a paragraph. It is a block-level element, meaning it automatically starts on a new line and takes up the full width available.
✅ Basic Syntax
<p>This is a paragraph.</p>
✅ Example: Paragraph in a Web Page
<!DOCTYPE html>
<html>
<head>
<title>Welcome to My Website</title>
</head>
<body>
<p>
The HTML <code><p></code> element inserts a paragraph in the document.
Paragraphs are block-level elements that create the basic structure of a document.
Browsers usually render them with some spacing above and below.
</p>
<p>
Note: Paragraphs cannot contain other block-level elements like another paragraph, div, or heading.
Nesting such elements inside <code><p></code> will result in unexpected behavior.
</p>
</body>
</html>
📚 Important Notes
<p>tags are used to group sentences into meaningful blocks.- They automatically add top and bottom margin (spacing) in most browsers.
- Do not put block-level tags like
<div>,<h1>, or another<p>inside a paragraph. - You can insert multiple paragraphs one after another, each in its own
<p>tag.
❌ Incorrect Example
<p>This is wrong <p>This is another paragraph</p> </p>
👉 This is invalid HTML and may break your page layout.
✅ Correct Way
<p>This is the first paragraph.</p>
<p>This is another paragraph.</p>
