The body Section | Day 03 of HTML Learning Series

Welcome to Day 03 of our 10-day HTML learning series! Over the past two days, we’ve explored the foundational aspects of HTML and the Head section.

Today we going to learn the body section



If you miss the Day 01, Day 02 Check out the link

Introduction to html

Head Section

What is the body Section in HTML?

The body section of an HTML document is where you place all the content that you want to display on your webpage. Unlike the <head> section, which contains metadata and links to resources, the body section is where your text, images, and interactive elements go.

Heading Tag


HTML heading are titles or subtitles that you want to display on webpage.

HTML provides six levels of headings, from <h1> to <h6>, with <h1> being the most important and <h6> the least.


    
<body>
  <h1>Main Heading</h1>
  <h2>Subheading</h2>
  <h3>Sub-subheading</h3>
</body>

In this example, <h1> defines the main heading, while <h2> and <h3> are subheadings, creating a clear hierarchy in your content.

Don't use h1 multiple times in your webpage

2. Paragraphs Tag

The <p> tag is used to define paragraphs in your HTML document. Each paragraph is automatically separated by a space, making your text easier to read.


    
<body>
  <p>This is a paragraph of text. It is used to provide detailed information to the reader.</p>
  <p>Another paragraph can follow, adding more content to the page.</p>
</body>

Using <p> tags helps break up your text into manageable sections, enhancing readability.


Break Tag

The <br> tag in HTML is used to insert a line break within text. It's an empty tag, meaning it doesn't require a closing tag.


    
<body>
    <p>This is the first line.<br>This is the second line after a line break.</p>
</body>

The hr Tag

The <hr> tag in HTML is used to create a horizontal line (or horizontal rule) across the page. This tag is typically used to visually separate content sections.


    
<body>
    <h1>Heading 1</h1>
    <p>This is the first section of content.</p>
    <hr>
    <h2>Heading 2</h2>
    <p>This is the second section of content, separated by a horizontal line.</p>
</body>

Image Tag

Images are a powerful way to make your webpage more engaging. Use the <img> tag to include images in your HTML. Don’t forget to use the alt attribute to provide a description of the image, which is important for accessibility and SEO.


    
<body>
  <img src="example.jpg" alt="A description of the image">
</body>

Link Tag

The <a> tag creates hyperlinks, allowing users to navigate to other pages or websites. Use the href attribute to specify the link’s destination.


    
<body>
  <a href="https://uvaiscodes.blogspot.com">Visit My Website</a>
</body>

Conclusion:

Today’s lesson covered the core elements of the <body> section in HTML. Understanding how to effectively use headings, paragraphs, images, and links will help you create well-structured and engaging web pages.

Stay tuned for Day 04, where we’ll explore lists in HTML

Thanks for reading 

Previous Post Next Post