Page 111 - Plus_V2.2_C7_Flipbook
P. 111
HTML Table Tags Meaning of the HTML Table Tags
<TABLE> The entire table itself
<CAPTION> The caption/title of the table
<THEAD> The header of the table shows the titles of the
columns at the top of the table.
<TBODY> The body of the table consists of the main data
wrapped in tags such as <TR>, <TD> e.t.c.
<TFOOT> The footer of the table shows summary information
like totals at the bottom.
<TR> The rows of the table
<TD> The cell that contains the data
<TH> The head of the column of the table
<STYLE> It is used to define the style information
HTML Table Tags and their meanings
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
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.
USING CSS WITH TABLES
CSS table styles elevate the visual appeal of plain HTML tables, enhancing their appearance and
readability. Various styling options, including adjusting borders, row-column dimensions, font
colors, and animations like hover effects, offer versatile ways to make HTML tables more engaging
and user-friendly.
CSS Table Properties
Table Properties in your document can be controlled using a variety of CSS properties. The basic
features that are available are listed in the following table along with how they map to the attributes
of table elements (<TABLE>).
Purpose Table Properties
Borders border
Width of table width
Height of table height
Spacing inside cell padding
Spacing between cells border-spacing
More on HTML5 109

