TABLES
are simply
grids made up of one or more cells. Here is a typical
(non-HTML) four-celled table created in Microsoft Word.
(fig. 52):
|
|
|
We can also use
tables in our item description by using the <table> tag
set.
(<table> tags never act alone - they are used in sets
just like list <ul> tags
In HTML,
tables cells can contain text, links or images. HTML tables can
also have visible or invisible borders. Here is an example of the HTML
formatting used to create a four-celled table. Each cell contains the
word “ebay”:
|
<table
border=1>
<tr>
<td>ebay</td>
<td> ebay</td> </tr>
<tr>
<td>ebay</td>
<td> ebay</td> </tr>
</table>
|
|
The
above HTML, when we copy it into our test.html document, save the changes and
then refresh our browser, creates the following table
(fig. 53):
Fig. 53
|
Let’s go
over each new HTML tag used to create this table in order to define
what each one does (fig. 54).
|
|
Fig. 54
|
1.
Every HTML table starts with a <table> tag and ends with
a </table> tag. THIS IS EXTREMELY IMPORTANT! If you use
tables in your item description and do not close them with the proper number
of </table> tags, your item description will not appear in some
types of web browsers!
|
2.
The <table> tag may take an attribute=value
pair for border=
value.
A value
of 0
will make the border invisible. Any other value
will show a border of increasing size. We will
use a value of 1.
|
3.
Every row in our table is indicated by a <tr> and </tr>
tag. (“tr” stands for “table row.”)
|
4.
Within every set of table row tags <tr> and </tr>,
table cells are created by inserting a <td> and </td>
tag for each cell. (“td” stands for “table data.”)
|
The
following HTML
shows an example of how to use a simple two-celled table to align two
images. Between each <td> and </td> tag, there is
a complete <img src> tag for a valid image file (figs. 55):
|
|
Fig. 55
|
Typing
the above HTML formatting into an item description would display the
following in a web browser (fig. 55a):
|
|
Fig. 55a
|
Each cell in the
above table contains a <img> tag with URLs that point to each picture
file.
TABLE tags allow
you to specify exactly how your image or text layout will display.
Use simple tables to make your item description layout look more
professional.
|
We have covered a lot of HTML ground in just
17 pages. Let's review everything so far...
|
