Intermediate Web Publishing: More HTML

Information Technology Curriculum, JQ Johnson <jqj@darkwing>

More tags for paragraph structure

HTML code

Formatted result

CHP command

A normal paragraph.
<P ALIGN=CENTER>
This paragraph<BR> 
is centered
in the cell.
<P ALIGN=RIGHT>
This paragraph, in 
contrast, ...

A normal paragraph.

This paragraph
is centered in the cell.

This paragraph, in contrast, is right-justified within the cell. Note the way words wrap.

<CENTER>anything</CENTER>
anything

<DL>
<DT>term
<DD>this might be ...
<DT>term2
<DD>another definition
</DL>
term
this might be the definition for the term above. Note the text flow in the definition.
term2
another definition

 

<BLOCKQUOTE>
Vigorous writing is
concise.
</BLOCKQUOTE>
Vigorous writing is concise.

Will Strunk, The Elements of Style.

Tags for fonts, characters, and colors

<BODY>

set background and default text colors. Options are BACKGROUND=url, BGCOLOR=color, TEXT=color, LINK=color, VLINK=color, ALINK=color

[document options button]

<FONT>...
</FONT>

change font. Options are COLOR=color, SIZE=n, +n, -n, FACE="face1,face2,..."

<SUP>...</SUP>
<SUB>
...</SUB>

create superscripts and subscripts

Style menu

A color is either "#RRGGBB", a hexadecimal red-green-blue triplet, or a color name.

Tags for tables

<TABLE>...
</TABLE>

surrounds the table. Options are BORDER=n, CELLSPACING=n, CELLPADDING=n, WIDTH=pixels_or_%, ALIGN={LEFT | RIGHT}

[CHP Table button]

<TR>...</TR>

define one table row (within a <TABLE>)

<TD>...</TD>

define one table cell (within a <TR>)

TR and TD may include ALIGN={LEFT | CENTER | RIGHT}, VALIGN={TOP | MIDDLE | BOTTOM}, and WIDTH=x. TD may include COLSPAN=n, ROWSPAN=n, NOWRAP. MSIE 2 and Netscape 3 add BGCOLOR=color to TABLE, TR, TD; MSIE 4 and Netscape 4 add BACKGROUND=url to TABLE, TD

Exercises

1. Using your web browser, download the index page for this class, <http://darkwing.uoregon.edu/~jqj/inter-pub/morehtml/>. Using Claris Home Page, center the "instructor" and "More HTML" heading, and convert the list of topics to a numbered list. Save and inspect using your browser.

2. Return to the page you saved. Change the background color to pale yellow, the color of the base font.to brown, and the color of the major heading to dark green. Inspect the HTML generated.

3. Write the HTML code needed to implement something like the following table:

                           Physical Properties        
  Element      Symbol    Number          Mass      
  Hydrogen         H          1             1.008     
  Helium           He         2             4.003

4. Look at several web pages that make use of tables for formatting, and guess how it's done. Now use "view source" to look at the HTML code.

For further reading

For further study and practice, look at the online materials described below using a World Wide Web browser. Note that many of these require Netscape 3 or later:

Among the more highly recommended books on HTML publishing are:

To learn more about HTML, you can also look at the sources for any other web documents you see and like. In Netscape, use the "View/Document Source" menu item.