| |
The most important thing
about images is their size.
Not the physical size of the image you see, but the actual size of
the image file in kilobytes, (kb).
Big graphics will slow down the loading of a web page.
Most graphics tools will allow you to resize an image.
Generally, saving it to .jpg, will produce the smallest file.
With .gif files, however, you can also use background transparency.
Images are generally positioned on a web page
using tables.
An image tag is placed within the table cell:
| <table
width="200" border="1" cellspacing="0" cellpadding="0" align="center"> |
|
Defines
table |
| <tr> |
|
Opens
row |
| <td> |
|
Opens
cell |
| <img
src="image_name.jpg"> |
|
Cell
contents: image tag |
| </td> |
|
Closes
cell |
| </tr> |
|
Closes
row |
| </table> |
|
Closes
table |
|
Example, (with
no border)
 |
Hi |
The code:
|
<table width="200" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td align="center" width="50%">
<img src="images/webthing02.gif" width="73" height="42">
</td>
<td align="center" width="50%" valign="middle">
<font face="Arial, Helvetica, sans-serif" size="5" color="#FF0000"><b>
Hi
</b></font>
</td>
</tr>
</table>
|
Notes:
Images are usually kept in a sub directory,
i.e.: images/
Specifying image size speeds loading.
Background images
If a small image is used as a background
to a web page, it will be repeated in both vertically and horizontally
across the page.
It is included in the Body tag, i.e.:
|
<body background="background.jpg" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
|
The are other options using Style Sheets.
|
