Maddog's HTML Primer for Real People

Chapter 11, Lesson 1

Ch 11, L 1 - A Picture-Frame for an Image

Let's say that we're so enamored of a sunrise picture we took, that we want to share it with the world, and put a picture frame around it, to boot. It's really easy to do, by creating a table, and giving it a pretty sizable border. Let's see:

<TABLE BORDER=25 CELLPADDING=0 CELLSPACING=0>
<CAPTION ALIGN="BOTTOM">A Really Cool Sunrise</CAPTION>
<TR><TD><IMG SRC="c11_1_p1.gif"></TD></TR>
</TABLE>
       
<TABLE BORDER=25 CELLPADDING=0 CELLSPACING=0 
    BORDERCOLORDARK="#996633" BORDERCOLORLIGHT="#CC6633">
<CAPTION ALIGN="BOTTOM">Cool Picture Frame, too</CAPTION>
<TR><TD><IMG SRC="c11_1_p1.gif"></TD></TR>
</TABLE>

A Really Cool Sunrise

Cool Picture Frame, too

In the first image, using the table created a gray-shaded picture-frame, by default. In the second image, we used the table's 'BORDERCOLORLIGHT' and 'BORDERCOLORDARK' attributes to create a colored border. By the way, if you're browser didn't display the second image's border in colors, your browser doesn't support those attributes, in which case you got the default grays.

In all probability, your browser placed the second image below the first image, even though there was no paragraph or line break explicitly coded. Currently, the HTML specs call for the table tags to generate an automatic double line break (like a paragraph). This may change in the near future, at which point tables will be allowed inline. For now, I suggest getting in the habit of using a '<BR>' or a '<P>' before and after each table, so that you won't be caught off-guard looking silly when the new browsers come out, which support inline tables.

Overseer: Monty Northrup ...

... leave e-mail ...