Table heads, bodies and footers : table « Tags « HTML / CSS






  1. HTML / CSS
  2. Tags
  3. table

Table heads, bodies and footers

    

<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

<head>
  <title>Table heads, bodies and footers</title>
  <style type="text/css">
    thead, tfoot {border:solid; background-color:#efefef; font-size:36px;}
    td {height:100px;}
  </style>
</head>

<body>
<table>
  <thead>
    <tr>
      <td colspan="4">This is the head of the table</td>
    </tr>
  </thead>

  <tfoot>
    <tr>
      <td colspan="4">This is the foot of the table</td>
    </tr>
  </tfoot>

  <tbody>
    <tr>
      <td>Cell 1</td>
      <td>Cell 2</td>
      <td>Cell 3</td>
      <td>Cell 4</td>
    </tr>
    <tr>
      <td>Cell 1</td>
      <td>Cell 2</td>
      <td>Cell 3</td>
      <td>Cell 4</td>
    </tr>
    <tr>
      <td>Cell 1</td>
      <td>Cell 2</td>
      <td>Cell 3</td>
      <td>Cell 4</td>
    </tr>
    <tr>
      <td>Cell 1</td>
      <td>Cell 2</td>
      <td>Cell 3</td>
      <td>Cell 4</td>
    </tr>
  </tbody>

  <tbody>
    <tr>
      <td height="100">Cell 1</td>
      <td>Cell 2</td>
      <td>Cell 3</td>
      <td>Cell 4</td>
    </tr>
    <tr>
      <td height="100">Cell 1</td>
      <td>Cell 2</td>
      <td>Cell 3</td>
      <td>Cell 4</td>
    </tr>
    <tr>
      <td height="100">Cell 1</td>
      <td>Cell 2</td>
      <td>Cell 3</td>
      <td>Cell 4</td>
    </tr>
    <tr>
      <td height="100">Cell 1</td>
      <td>Cell 2</td>
      <td>Cell 3</td>
      <td>Cell 4</td>
    </tr>
  </tbody>
</table>
</body>
</html>








Related examples in the same category

1.'table' Example
2.Nested tables
3.How tables linearize
4.A basic table
5.'col' Example
6.'summary' specifies a brief description of a table
7.basic table
8.Basic table with tr, td
9.A simple XHTML table
10.table tag opens a table
11.Table inline style
12.Calendar table
13.Fixed table first column
14.Make table font bold
15.table font-family: arial, verdana, sans-serif;
16.Table style
17.table color: white;
18.Table layout
19.Table styling
20.Table with shading colors
21.HTML markup for a simple table (continued)
22.providing table alignment and spacing
23.A table with spanned rows and columns
24.Img in a table cell
25.Table with summary
26.Using th for table heading
27.Dividing a table into head, body and footer.
28.A Basic Table with Caption
29.Using the table header attribute
30.table line-height: 1.3em;
31.table padding: 0;
32.table color: #fff;
33.table table-layout: fixed;
34.table caption-side: bottom;
35.HTML markup for a simple table
36.Vertical alignment in table cells
37.Styling table columns
38.A Basic Table 2
39.Adding Text Alignmnet for table
40.Stripe the table
41.Nested css table
42.Structural Table
43.CSS Table Rowspan Demo
44.Spreadsheet data
45.Fixed Table
46.Shrinkwrapped Table
47.All table content is enclosed within the tbody
48.Style for table body
49.Horizontal Stretched Table
50.Using the th element for table headings
51.An Accessible Table
52.Selecting cells in body
53.Selecting all tables and cells
54.Selecting all cells
55.'align' specifies the horizontal alignment of the 'table' and 'iframe'