Basic HTML Version

|  | Table of Contents |  | View Full Version

Page 38 - 2625 PortGPt V2.1
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

| 33 34 35 36 37 38 39 40 41 42 43 |