Basic HTML Version

|  | Table of Contents |  | View Full Version

Page 111 - 2626_South Point_C-7
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

| 106 107 108 109 110 111 112 113 114 115 116 |