Font stuff:
<font face=”Arial” size=”2” color=”green”>the formatted text</font>
Can be nested:
<font face=”Arial”>this text is Arial<font color=”green”>This text is Arial AND green</font>this text is just Arial again</font> <-- notice TWO closing /font tags
Preformatted text:
<pre>
you can have columns inside “pre” tags
</pre>
Tables:
<table>
<tr>
<td>some content</td>
</tr>
</table>
table elements:
tr: table ROW
td: table DATA (cells)
table attributes (things that go inside the opening table tag):
1. border, in pixels: specifies the thickness of the line (if any) around the table
2. cellpadding, in pixels: space between each cell’s content and the surrounding cell
3. cellspacing, in pixels: space between cells
4. width, in pixels OR as a percentage of the window size; default is 100 percent
Other table tips:
• <caption>description of my table</caption>: Put just after opening <table> tag; will appear just above or just below your table, default is just above
• bgcolor can be applied to an entire table, or to a row, or to individual cells
• width and height (pixels or percentages) can be specified in <td> tags; browser default is to make each <td> the same width/height as the others, OR as big as needed to contain what’s in it (for example, a large picture will stretch a td). Be careful with the math -- in other words, if your table is 400 pixels wide and you tell one cell to be 300 pixels and the other cell to be 200 pixels, 300+200=500 which is more than 400, and the results are unpredictable.
• Irregular tables: use colspan and rowspan within the <td> tags
Example:
<table border="5" cellpadding="4" cellspacing="8" width="500">
<caption align="bottom">this is my caption</caption>
<tr>
<td colspan="2">this text is two columns wide</td>
</tr>
<tr>
<td width="75%" bgcolor="lightgray">second row, first column, 75 percent of total table width, with its own bgcolor</td>
<td rowspan="2">second row, second column,
which spans down into third row</td>
</tr>
<tr>
<td height="100">third row, first column, 75% of width because of the cell above, 100 pixels high</td>
</tr>
</table>
Looks like:
Irregular tables, usually with border=”0”, are how many web designers make complex sites. View the source of www.ists.dartmouth.edu to see the zillions of tables that make up that site.