Raj Kumar
Computer Science And Engineering

Explain the basic table Structure . Create an HTML Document for the following figure.
OneTwo
ThreeFour

Web Technology and its Applications

Explanation

1208    0

Basic Table Structure

At their most basic, tables are made up cells, arranged into rows. You can control display characteristics for the whole table, for individual rows, and for individual cells.

<table border="1px" style="width:300px">
  <thead>
    <tr>
      <th>First Name</th>
      <th>Last Name</th>
      <th>Age</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Jill</td>
      <td>Smith</td>       
      <td>50</td>
    </tr>
    <tr>
      <td>Eve</td>
      <td>Jackson</td>     
      <td>94</td>
    </tr>
    <tr>
      <td>John</td>
      <td>Doe</td>     
      <td>80</td>
    </tr>
  </tbody>
</table>

 

(1) Kinds of cell in HTML

A table cell in HTML is a non-empty element and should always be closed. There are two different kinds of table cell in HTML: normal table cell and header cell. <td> denotes a table cell, the name implying 'data', while <th> denotes a table 'header'. The two can be used interchangeably, but it is recommended that header cell be only used for the top and side headers of a table.

Syntax:-

A table cell also must be nested within a <table> tag and a <tr> (table row) tag. If there are more table cell tags in any given row than in any other, the particular <tr> must be given a colspan attribute declaring how many columns of cells wide it should be.

Example:-

An example of an HTML table containing 4 cells:

Cell 1 Cell 2
Cell 3 Cell 4

 

(2) Data Type

A data type must be specified for each column & for each attributes compromising on abstract data type. They are classifieed broadly as pre-defined data type.

<!DOCTYPE html>
<html>
<body>
<table border="1" cellspacing="0">
<tr>
<th rowspan="2"> One</th>
<th colspan="2">Two</th>
</tr>
<tr>
<td>Three</td>
<td>Four</td>
</tr>
</table>
</body>
</html>

 output:-

 

One Two
Three Four


Share:   
   Raj Kumar
Computer Science And Engineering

More Questions from Web Technology and its Applications Module 2