Internet Explorer 3.0
Enhanced Tables: Step By Step
Follow the instructions below for an introduction to how you can enhance your HTML tables for use with Internet Explorer 3.0!
Step 1: Try a background graphic.
Internet Explorer 3.0 can place a background graphic behind any table cell, or even behind an entire table. This is a great boon for designers who want to overlay text on graphics. The HTML is simple: just add BACKGROUND="address of picture" to any <TABLE>, <TD;>, or <TR> element in your table.
Here's a table that uses background images to place a patterned border around a central cell:
What gives Volcano Coffee
its rich, deep aroma and
tastebud-tingling bouquet? It's the beans, stupid!
And here's the HTML code. Note that we have used not only background images but also background colors; this gives the viewer something to look at while the images are being loaded.
Background images in table cells can be transparent.
Step 2: Control the rules.
If you want to specify that your table should only have rules (borders) between the rows, use the following:
<TABLE RULES=ROWS>
If you want to only have rules between the columns, use RULES=COLS instead. For a table with an outside border but no rules, use RULES=NONE.
Step 3: Want to align text by baseline?
Here's what happens in an ordinary Web browser when you try to use text of very different sizes in adjacent cells:
Q4 '96 Profits
Sept
Oct
Nov
Dec
The results look a little odd because the baselines of the text are not aligned. Internet Explorer 3.0 corrects this problem by allowing you to add VALIGN=BASELINE to any <TD> tag. Here's the same table with the text aligned by baseline:
Q4 '96 Profits
Sept
Oct
Nov
Dec
Congratulations!
You've just learned three simple ways to enhance your tables for use with Internet Explorer 3.0!