Page 38 - PortGPT_V2.1_C7_Flipbook
P. 38
CREATING TABLES
Tables represent the data in the form of rows and columns. In HTML5, a table is created by using
the <TABLE> tag. The <TABLE> tag should be defined inside the <BODY> tag. It is a container tag.
Different kinds of tables can be created by using the following child tags of the <TABLE> tag:
• <TR>: This tag is used for defining table rows.
• <TD>: This tag is used for defining table data, that is, the data of the cells.
• <CAPTION>: This tag is used for defining the title of the table.
• <TH>: This tag is used for defining table headings.
Following is an example of a table:
Table: Student
Roll No. Name Grade Gender
1 Aarav B M
2 Gauransh A M
3 Himakshi A F
4 Rakshit B M
Students record
Where, Table: Student is the Title of the table which can be inserted by using the <CAPTION> tag.
Roll No., Name, Grade and Gender are the table headings that can be created by using the <TH> tag.
CSS Properties Used with <TABLE> Tag
CSS provides various properties which can be used with <TABLE> tag to accomplish various tasks.
They are border, border-style, border-color, border-spacing, width, padding, background-color and
color. These are global properties of CSS which means that these can be used with any element of
HTML. Let us see how to use these properties with <TABLE> tag while creating a table in HTML.
Using border Property
The border property of CSS allows you to apply a border to an element of HTML like <TABLE>. For
example:
<style>
table, th, td{border:2px;}
</style>
Preceding code will apply a border of 2px to the table.
Write HTML codes to use border property.
<!DOCTYPE html>
<HTML>
36 Premium Edition-VII

