HTML Tables
HTML Tables
HTML Tables
HTML Tables
Previous Next Chapter
HTML Tables
Tables are defined with the <table> tag. A table is divided into rows (with the <tr> tag), and each row is divided into data cells (with the <td> tag). td stands for "table data," and holds the content of a data cell. A <td> tag can contain text, links, images, lists, forms, other tables, etc.
Table Example
< t a b l eb o r d e r = " 1 " > < t r > < t d > r o w1 ,c e l l1 < / t d > < t d > r o w1 ,c e l l2 < / t d > < / t r > < t r > < t d > r o w2 ,c e l l1 < / t d > < t d > r o w2 ,c e l l2 < / t d > < / t r > < / t a b l e >
How the HTML code above looks in a browser: row 1, cell 1 row 1, cell 2 row 2, cell 1 row 2, cell 2
4/4/13
HTML Tables
useful, but most of the time, we want the borders to show. To display a table with borders, specify the border attribute:
< t a b l eb o r d e r = " 1 " > < t r > < t d > R o w1 ,c e l l1 < / t d > < t d > R o w1 ,c e l l2 < / t d > < / t r > < / t a b l e >
< t a b l eb o r d e r = " 1 " > < t r > < t h > H e a d e r1 < / t h > < t h > H e a d e r2 < / t h > < / t r > < t r > < t d > r o w1 ,c e l l1 < / t d > < t d > r o w1 ,c e l l2 < / t d > < / t r > < t r > < t d > r o w2 ,c e l l1 < / t d > < t d > r o w2 ,c e l l2 < / t d > < / t r > < / t a b l e >
How the HTML code above looks in your browser: Header 1 Header 2
More Examples
Tables without borders How to create tables without borders. Table headers How to create table headers. Table with a caption How to add a caption to a table. Table cells that span more than one row/column How to define table cells that span more than one row or one column. Tags inside a table How to display elements inside other elements.
w3schools.com/html/html_tables.asp 2/3
4/4/13
HTML Tables
Cell padding How to use cellpadding to create more white space between the cell content and its borders. Cell spacing How to use cellspacing to increase the distance between the cells.
Previous
Next Chapter
w3schools.com/html/html_tables.asp
3/3