User:Elina Real Teaching Lesson Plan 15
Subject:Computer Science | Class:8"A" |
---|---|
Unit:17 | Topic:Table in HTML |
Period:7th | Time:45min |
School:Adarsha Secondary School | no of student:64 |
Specific Objective:
At the end of this class, student will be able to:
- Understand the concept of the HTML table,
- create a table and assign data in tabular form.
Teaching Material:
- Whiteboard, marker,
- computer with text editor(noteppad,vs code).
- Browser for testing(chrome and ms edge).
Introduction:
- Start by asking a questions about HTML tags,
- Encourage them to share their thought,
- HTML table tag is used to display data in tabular form (row * column). There can be many columns in a row.
- We can create a table to display data in tabular form, using element, using <table> element, with the help of <tr> , <td>, and <th> elements.
- In each table , table row is defined by <tr> tag, table header is defined by <th>, and table data is defined by <td> tags.
- HTML table used to manage the layout of the page e.g header section, navigation bar, body content, footer section etc
- But it is recommended to use div tag over table to manage the layout of the page .
HTML table tag:
Tag | Description |
---|---|
<table> | Define a table |
<th> | Define a header cell in table |
<tr> | Define a row in a table |
<td> | Define a cell in a table |
<caption> | Define a table caption |
<colgroup> | Specifies a group of one or more column in a table for formating |
<col> | Specifies a colum properties for each column within a <colgroup> element. |
<thead> | Group the header content in a table. |
<tbody> | Group the body content in a table. |
<tfoot> | Group the footer content in a table. |
Class Room Activity:
- Have student open their prefered text editor and create a new HTML document.
- Demonstarte how to create a simple table structure using <table>, <tr>, <td> and <th> tags.
- Create a table that include header and a few row of data.
- Table:
Conclusion:
- Summarize a ey points about HTML tables discussed during the lesson,
- Encourage students to practice table on their own and explore more advanced table functionalities,
Assessment:
- How create table in web page ?write a step.
- How to create table in HTML document with border.
- Create a table using your personal data( Name,DOB,Address,email id).