1. Yourfriendmanoj.wordpress.com Fb/yourfriendmanoj
TABLES IN HTML
Yourfriendmanoj.wordpress.com
Fb/yourfriendmanoj

2. Table
Tables are used in HTML documents (web pages) to present tabular data.
The HTML table model allows authors to arrange data -- into rows and columns.

3. Tags for table <table>
An HTML table is defined with the <table> tag.
It contains start and end tag.
<tr>
Each table row is defined with the <tr> tag
<td>
A table data/cell is defined with the <td> tag.

4. Additional tags in html
A more complex HTML table may also include <caption>, <col>, <colgroup>, <thead>, <tfoot>, and <tbody> elements. <th> A table header is defined with the <th> tag. <caption> It is used to set the title of a table.

5. Syntax

6. Example

7. ATTRIBUTES OF TABLE TAG
"align",
"bgcolor",
"border",
"cellpadding",
"cellspacing",
"frame",
"rules",
"summary",
"width"

8. ALIGN ATTRIBUTE(table)
The align attribute specifies the alignment of a table according to surrounding text.
Syntax
<table align="left|right|center">
VALUES are:
Value Description
Left Left-aligns the table
Right Right-aligns the table
Center Center-aligns the table

9. HTML <table> bgcolor Attribute
The bgcolor attribute specifies a background color of a table.
Syntax
<table bgcolor="color_name">

10. HTML <table> border Attribute
The border attribute specifies if a border should be displayed around the table cells or not.
Syntax
<table border="1|0">
Attribute Values
Value Description
0 No borders around the table cells
1 Add borders around the table cells

11. HTML <table> cellpadding Attribute
The cellpadding attribute specifies the space, in pixels, between the cell wall and the cell content.
Syntax
<table cellpadding="pixels">
Attribute Values
Value Description
Pixels The space between the cell wall and the cell content

12. HTML <table> cellspacing Attribute
The cellspacing attribute specifies the space, in pixels, between cells.
Syntax
<table cellspacing="pixels">
Attribute Values
Value Description
Pixels The space between cells

13. HTML <table> frame Attribute
The frame attribute specifies which parts of the outside table borders that should be visible.
Syntax
<table frame="value">
Attribute Values
…….

14. … Attribute Values Value Description
Void The outside borders are not shown
Above The top outside border is shown
Below The bottom outside border is shown
Hsides The top and bottom outside borders are shown
Vsides The left and right outside borders are shown
Lhs The left outside border is shown
Rhs The right outside border is shown
Box The outside borders are shown on all four sides
Border The outside borders are shown on all four sides

15. HTML <table> rules Attribute
The rules attribute specifies which parts of the inside borders that should be visible.
Syntax
<table rules="value">
Attribute Values
Value Description
None No lines
Groups Lines between row groups and column groups
Rows Lines between rows
Cols Lines between columns
All Lines between rows and columns

16. HTML <table> width Attribute
If the width attribute is not set, a table takes up the space it needs to display the table data.
<table width="pixels|%">
Attribute Values
Value Description
Pixels Sets the width in pixels (example: width="50")
% Sets the width in percent of the surrounding element (example: width="50%")

17. Creating rows The <tr> tag defines a row in an HTML table.
A <tr> element contains one or more <th> or <td> elements.

18. Creating columns
The <th> tag defines a header cell in an HTML table.
An HTML table has two kinds of cells:
Header cells - contains header information (created with the <th> element)
Standard cells - contains data (created with the <td> element)
The text in <th> elements are bold and centered by default.
The text in <td> elements are regular and left-aligned by default.