1

Fundamentals of Web designing

Ministry of Higher EducationBamyan University

Computer Science Department

Presented by : Mustafa Kamel MohammadiEmail : bamian.cs@gmail.com

Working tables in HTML

2

learning objective In this chapter you will learn

How to create tables in HTML

3

Tables in HTML Table is a structured element that consists of rows and columns of cells The <table> and </table>tags define where the table begins and ends The <tr>and </tr> tags define where each row begins and ends The <td>and </td>tags define the individual cells within each row.

<table><tr>

<td> 1 </td><td> 2 </td><td> 3 </td>

</tr>

</table>

4

Table borders and cell spacing, padding To add border around table you can use “border” attribute To control spaces between cells in a table, use “cellspacing” attribute To control space between cell and its internal content use “cellpadding”

<table border=”2” cellspacing=”10” cellpadding=”10” bordercolor=”#FF0000”>

</table>

5

Spanning columns an rows To span a cell across columns use “Colspan” attribute in <td> tags

It take a numeric value, the value indicates the number of columns To span a cell across columns use “rowspan” attribute in <td> tags

It take a numeric value, the value indicates the number of rows

<td colspan=”3”> 1 </td><td rowspan=”3”> 1 </td>

6

Table alignment and dimension To align table in respect to texts around it, set “align” attribute for <table> tag to

(left, right, center) To align content of cell set “align” attribute for <td> tag. We can also set width and height for tables using “width” and “height” attr.

<table align=“left” width=“800” height=“400” >

</table>

7

Background color of table Use “bgcolor” attribute to set background color for <td>, <tr>,<table>

<table bagcolor=“cyan”><tr bgcolor=“red”>

<td bfcolor=“blue”></td></tr>

</table>

8

Logical structure of table<table>

<thead><tr><th></th></tr></thead><tbody><tr><td></td><td></td></tr></tbody>

<foot><tr><td colspan=2></td></tr></tfoot>

</table>

9

10

References• “HTML 4 dummies 5th edition” by Ed Tittel & Mary Burmeister• “HTML 5 designing rich internet applications” by Mathew Dawid• “HTML in ten simple steps” by Robert G. fuller