Adding Colour and Images
The next stage is to add a bit of colour to your table.
You can have your borders coloured, the background coloured, individual cells and borders coloured, Images for background in Table or Table Data tags.
| To colour the border add bordercolor=" " to the opening table tag <table border=1 bordercolor="Red"> |
|
| To colour the table background add bgcolor=" " to the opening table tag <table border=1 bgcolor="Red"> |
|
To colour the table background and border add
bgcolor=" " bordercolor=" "to the opening table tag<table border=1 bgcolor="Red" bordercolor="Yellow"> |
|
To remove the inner border add
cellspacing ="0"
to the opening table tag
<table border=1 bgcolor="Red" bordercolor="Yellow" cellspacing ="0"> |
|
You can have an image as the table background and table cell background.
Add background="image.gif " to the opening <table> tag
| You can use .bmp .jpg .gif | This will give the entire table a different background to your page |
Not only does the following table have the same background as the table above, it also has a different image in one of its cells.
This is done by adding the background=" " to the <TD> tag as well as the <TABLE> tag.
Add
background="image.gif " to the <table> tag
and background="image.gif" to the <td> tag | Text shows over the images | If no text is used you will have to add width and height
<td background="your image" width=60 height=60> |
CellSpacing=" " allows for a space between cells
<table cellspacing="10">
So by having a <table bgcolor> and a different <td bgcolor>
You can have something like this | Include the bordercolor=" " in the <td> tag
and this cell gets its own border colour as well |
CellSpacing allows for a space between cells, CellPadding allows for a space between the contents of the cell and the cell walls.
Notice this text is away from the sides | <table border=1 bordercolor="#FFFF00" bgcolor="FF00FF" cellspacing ="5" cellpadding=20 > |