Lesson n°5: tables
 

The creation of tables with a software is convenient, but to be able  to correct or to modify a code source is often very useful
We suggest you to be get used whith these tags :
 
 

 
tags allowing the realization of a table :
Tags : Functions : Attributes:

<table>

< / table>

 the Beginning and the end of the table
  • cols: number of columns of the table ex : cols = "3" 
  • boder : width of the line(feature) (used with the other tags) 
  • width: width of the table, can be indicated in pixels or in percentages ex. :width = "200" or width = " 50 % " 
  • cellpadding: determine the free space, in pixels, between the text and the edge of the cell ex: cellpadding = "5" 
  • cellspacing: free space between two cells ex: cellpspacing "5" 
  • align: adaptation of the table with regards to the document (left, center, right), as for picture 
  • bgcolor: allows to select a true colour

< tr >

< / tr >

 New line
  • valigns (top, middle, bottom): position of the text in high in the cell (concerns all the line) 
  • align (left, center, right): positions the text in width in the cell

< td >

< / td >

 New cell
  • valigns (pip, middle, bottom): position the text in high in the cell (concern only the cell). 
  • aligns (left, center, right): position the text in width in the celulle 
  • colspans : oblige the browser to show a cell on several columns. Ex: colspan = "3" (used to realize the first cell of this table) 
  • rowspan obliges the browser to show a cell on several lines

 

Example:

 
< table border="1"
< tr >
< td > cell 1 < / td >
< td > cell 2 < / td >
< / tr >
< tr >
< td > cell 3 < / td >
< td > cell 4 < / td >
< / tr >
< / table>		 result is the following one:
 
cell 1 cell 2
cell 3 cell 4

Notice: tables with a border 0 are very often used to make the pagination of document

Exercise: realize a simple table, then a more complex table. Help yourself with colspan and rowspan. This more complex table is difficult to be realized  another way.
 
 

Lesson 6-Contents