Headings and Paragraphs

Yaser Rahmati | یاسر رحمتی

1. HTML Headings

Headings are used to define titles and subtitles on your web page. HTML provides six levels of headings, from <h1> (largest) to <h6> (smallest).

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>

Explanation:

  • <h1> is typically used for the main title or the most important heading.

  • <h2> to <h6> are used for subheadings and less important titles, with each level decreasing in size and importance.

Example:

<!DOCTYPE html>
<html>
<head>
    <title>HTML Headings Example</title>
</head>
<body>
    <h1>Main Title</h1>
    <h2>Subheading 1</h2>
    <h3>Subheading 2</h3>
    <h4>Subheading 3</h4>
    <h5>Subheading 4</h5>
    <h6>Subheading 5</h6>
</body>
</html>

2. HTML Paragraphs

The <p> tag is used to define a paragraph of text. Each block of text enclosed in <p> tags is treated as a separate paragraph.

  • Syntax:

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

  • Explanation:

    • The <p> element will automatically add space before and after the paragraph to separate it from other content.

    • Paragraphs are block-level elements, meaning they take up the full width of their container by default.

  • Example:

<!DOCTYPE html>
<html>
<head>
    <title>HTML Paragraphs Example</title>
</head>
<body>
    <p>This is the first paragraph. HTML paragraphs are useful for organizing content in blocks of text.</p>
    <p>This is the second paragraph. You can add as many paragraphs as you need.</p>
</body>
</html>

3. Combining Headings and Paragraphs

You can combine headings and paragraphs to structure your content clearly.

  • Example:

<!DOCTYPE html>
<html>
<head>
    <title>Headings and Paragraphs Example</title>
</head>
<body>
    <h1>Welcome to My Web Page</h1>
    <p>This is an introductory paragraph that gives some basic information about the page.</p>

    <h2>About HTML</h2>
    <p>HTML is a markup language used for creating web pages. It stands for Hypertext Markup Language.</p>

    <h3>Learning HTML</h3>
    <p>It's easy to learn HTML if you start with the basics and practice regularly.</p>
</body>
</html>

This example shows how headings and paragraphs work together to organize content logically.

Keywords

HTML, Hypertext Markup Language, Tags, Elements, Attributes, Head, Body, Paragraph, Heading, Title, Meta, Link, Image, Anchor, Hyperlink, List, Table, Form, Input, Button, CSS, Class, ID, Inline, Block, Div, Span, Script, Styles, Font, Color, Background, Margin, Padding, Border, Doctype, HTML5, Video, Audio, Canvas, SVG

External Links

🌐 Personal Website 📄 Resume 🎥 Video Archive 💼 Finance Blog 🔐 Network & Security Notebook 🎬 Aparat Channel

PreviousBasic HTML StructureNextText Formatting Tags

Last updated