Lesson 3 - Graphics

First, before we get to graphics, let's discuss a few more tags used for formatting.

SPACERS
To insert an empty block of space in Netscape only, use the <SPACER> tag.
<SPACER TYPE="horizontal" SIZE=25>This is indented text
would display:
This is indented text

A horizontal spacer inserts blank space in a horizontal line. The TYPE attribute can also be "vertical". Horizontal is useful for simulating indents. Vertical would be used to insert vertical space between paragraphs like..........this. This was a vertical spacer 30 pixels in size.

SPACERS can also be used within a sentence like this.

A block type spacer has attributes of WIDTH and HEIGHT. The values of these attributes is the desired width and height of the spacer in pixels. An ALIGN attribute can also be used with values of LEFT, RIGHT, TOP, or BOTTOM. The SPACER tag is not closed. It would be used like this:
<SPACER TYPE="block" WIDTH="45" HEIGHT="40" ALIGN="left"> This is text that is wrapping
 around the SPACER.
 The SPACER is left aligned and 45 pixels wide
 and 40 pixels high.
would display:
This is text that is wrapping
around the SPACER.
The SPACER is left aligned and 45 pixels wide
and 40 pixels high.

Notice how the text wraps around the spacer. Remember that Internet Explorer ignores the spacer tag. The text would look normal in IE. The SPACER can be very useful when trying to position elements on your webpage.

COLUMNS
<MULTICOL COLS="3" GUTTER="20" WIDTH="90%">Enter your text here.</MULTICOL>

The COL attribute's value is the number or columns to be displayed. The GUTTER attribute sets the amount of space between the columns in pixels. The WIDTH attribute sets the width of the set of columns, either in pixels, or as a percentage of the browser window. The browser will set the length of the columns to the minimum amount required to fill all three columns. You can use other text formatting tags within the MULTICOL tag, such as CENTER, etc.

The GUTTER and WIDTH tags are optional. If not specified, the defaults are set at a GUTTER of 10 pixels and the WIDTH is set to 100%. The MULTICOL tag must be closed. MULTICOL is ignored by IE.

NON-BREAKING SPACE
If none of the previously learned formatting tags seem to work to place your text or graphics in the right position, you can always use the non-breaking space. It allows your browser to recognize more than one space in a row. The code for a non-breaking space is  .
EXTRA         SPACE
would display:
EXTRA SPACE

Instead of using several non-breaking spaces, try using the PRE tag, the SPACER tag, or pixel shims.

BLOCKQUOTE

The <BLOCKQUOTE> tag is used to quote long passages within your webpage.
<BLOCKQUOTE>Quoted text here.</BLOCKQUOTE> This tag indents both the left and right sides of the text as seen in this paragraph. Be sure to close with the </BLOCKQUOTE> tag. Additional formatting tags can be used with in the blockquote. There are no additional attributes to this tag.

NO BREAK
If for some reason you do not want your browser to automatically wrap text, enclose it within the and the tags. If the text goes beyond the right edge of the browser window, then the viewer must use a scroll bar to view it. You can also include optional breaks with the tag. If the tag is found in text that would be beyond the normal browser window, the browser will insert a break and continue the text on the next line. If the is found in text within the normal browser window, it is ignored. Although Netscape and IE both recognize the tags, only Netscape recognizes the tag, which is not closed. By the way, I have no idea what the W in WBR stands for, do you?

To move on to graphics, click on the duck.