Header Ads Widget

Ticker

6/random

How To Create Table In HTML?

Related image

How To Create Table In HTML?
HTML table tag is used to create table in html and <table> tag contains more other tag that define the structure of the table and create a proper table on the html document 
Tables consist of the <table> element as well as other table-related elements. These other elements are nested inside the <table> tags to determine how the table is constructed.
Syntax
<table>
Here we create a table...
</table>
Other Element That Used To Construct Table
<th> This tag is used to create table heading
<tr> This tag is used to create table row
<td> This tag is used inside the <tr> tag and are used to insert data into table so that is also called table data
Some Of Table Tag Attributes

bgcolor attribute − You can set background color for whole table or just for one cell.
background attribute − You can set background image for whole table or just for one cell.
bordercolor attribute.
rowspan use to merge rows
colspan use to merge column
align: use set alignment of the table
width: use to set width of the table
height: use to set height of the table
border use to show border on table
caption: use to show caption on the table
cellpadding use to set pad of a cell 
cellspacing use to give space between cells
<thead> − to create a separate table header.

<tbody> − to indicate the main body of the table.

<tfoot> − to create a separate table footer.
Image result for html table tag

Example
<table>
 <tr>
  <th>Table Header 1</th>
  <th>Table Header 2</th>
 </tr>
 <tr>
  <td>Cell 1</td>
  <td>Cell 2</td>
 </tr>
 <tr>
  <td>Cell 3</td>
  <td>Cell 4</td>
 </tr>

</table>

More Example

<table border = "1">
<thead>
     <tr><th colspan="2">Table Header (thead)</th></tr>
</thead>
<tfoot>
     <tr><th colspan="2">Table Footer (tfoot)</th></tr>
</tfoot>
<tbody>
<tr>
<td>Cell 1 - part of tbody</td>
<td>Cell 2 - part of tbody</td>
</tr>
<tr>
<td>Cell 3 - part of tbody</td>
<td>Cell 4 - part of tbody</td>
</tr>
<tr>
<td>Cell 5 - part of tbody</td>
<td>Cell 6 - part of tbody</td>
</tr>
</tbody>
</table>



Post a Comment

0 Comments