Lesson 14

Image on a texture

We have been working with images in tables, but we have relied heavily on height and width in our table tags.

Now we will place an image on a texture (tiling background) and use cellspacing and cellpadding instead of height and width.

I like sailing so I'll use a tiling water image for my background and place a sailboat on it.

Since I want to demonstrate the power of cellspacing & cellpadding, I will limit myself to a 1x1 table.

Cellspacing and/or border will control the size of my frame.

Cellpadding will control the size of my "ocean".

Here are the images I'm working with:

Sailboat

Water

Marble for frame

Here is my table with no border, cellspacing or cellpadding.

Here is my table with border, cellspacing and cellpadding.

Notice how compact the table code is, simple yet powerful.
I've added bgcolors so there is something to look at while the images are loading.

Homework Assignment

• Make a table with an image on a texture
• Frame your table
• Post your table
• Show your work