HTML Table

0

- Advertisement -

Table contains columns and rows which are used to show the data in HTML.

<table></table> are table tags.

<table border=value></table> creates a table with borders.

<tr></tr> are row tags.

<td></td> are cell tags.

Example:

Output:

Explanation:

<table border="1"> creates a table with the border width 1 pixels.

<tr></tr> specifies the rows of the table.

<td>cell 1</td> specifies the cell of the tables and its content.

Width & Height

The attribute “width” specifies the width of the table. The attribute “height” specifies the height of the table.

The value can be a percentage or pixels.

Example

Output:

Explanation

border="2" sets the table border width as 2 pixels.

width="200" sets the table width as 200 pixels.

height="30%" sets the table height as 30% of the browser window.

Background Color

bgcolor="value" sets the background color of table, row or cell

Example

Output

Explanation

bgcolor="yellow" sets the background color as yellow.

Cell Spacing

cellspacing="value" sets the spacing among cells.

Output

Explanation

cellspacing="10" sets the cells spacing as 10 pixels.

Align Text

align="value" sets the text on left, center, right.

Example

Output

Explanation:

<tr align="right"> sets the text aligning with the right side.

Valign Text

valign="value" sets the text on top, middle, bottom.

Example

Output

Explanation:

valign="middle" sets the text aligning with the middle.

Caption

<caption></caption> are used to display the caption of the table.

Example

Output

Explanation

<caption>Table Caption</caption> displays the Table Caption.

The Height of Row

height="value" sets the height of the row.

Example

Output

Explanation

<tr height="50"> sets the height of the row as 50.

The width of Column

width="value" sets the width of the column

Example

Output

Explanation

width="100" sets the width of the cell as 100 pixels.

Border Color

bordercolor="blue" sets the table, row or cell border color.

Output

Explanation

bordercolor="blue" sets the table border as blue.

Span Rows, Columns

A cell can span across a number of rows or columns.

rowspan="value" or colspan=”value” specifies the numbers of rows or columns to span across.

Example for rowspan

Output

Explanation

rowspan="2" specifies the 2 rows that will be spanned across.

Example for colspan

Output

<table border="1"> creates a table with the border with 1 pixels.

<tr></tr> specifies the rows of the table.

<td></td> specifies the cell of the table and its contents.

colspan="3" specifies the 3 columns that will be spanned across.

align="center" sets the next aligning to the center.

- Advertisement -

Leave A Reply

Your email address will not be published.