π Day 5 β HTML Tables & Forms
π₯ Download Notes + Example Code (PDF):
π Click here to download Day 5 Notes
π Introduction
In this lesson, you’ll learn how to create tables and forms using HTML. These elements are essential for displaying structured data (like results) and collecting user input (like in shopping or login forms). Mastering them will help you build real-world, functional web pages.
π HTML Tables
Tables in HTML help organize data in rows and columns. They are created using the <table>
tag, and within that, you define rows and cells.
πΉ Table Structure:
πΉ Explanation of Tags:
-
<table>
: Starts the table -
<tr>
: Creates a new row -
<th>
: Creates a header cell (bold & centered) -
<td>
: Adds data to the row
π Use Case:
Used for displaying:
-
Exam results
-
Timetables
-
Product lists
π HTML Forms
Forms are used to collect user inputs. Common use cases include contact forms, login forms, and checkout forms in e-commerce websites.
πΉ Basic Form Example:
πΉ Explanation of Tags:
-
<form>
: Defines the form area -
<label>
: Describes the input field -
<input>
: Accepts user data -
<button>
: Submits the form
π Use Case:
Used in:
-
Sign-up forms
-
Feedback forms
-
Booking or order pages
β Summary
In this lesson, you learned how to:
-
Use
<table>
,<tr>
,<td>
, and<th>
to structure tabular data -
Use
<form>
,<input>
,<label>
, and<button>
to create interactive forms
These tags form the backbone of data presentation and user interaction in HTML.
Stay tuned for the next lesson where weβll start learning CSS to style our HTML content!