HTML Cheat Sheet

Text Formatting

Bold

     <b>Bold Text</b>

Italic

     <i>Italic Text</i>

Bold Italic

     <b><i>Bold Italic Text</i></b>

Underline

     <u>Underlined Text</u>

Font Colors

     <font color=green>Green</font>

     <font color=red>Red</font>

     <font color=blue>Blue</font>

     <font color=purple>Purple</font>

     <font color=orange>Orange</font>

     <font color=gray>Gray</font>

... and 210 others; click here for the complete list of colors.

Major Heading

     <h1>Major Heading</h1>

This tag's look and feel is controlled in the DOCStudio template system because we want a consistent look to the way common page elements are formatted. If you want a different look, contact your DOCStudio technician.

Subhead

     <h2>Subhead</h2>

This tag's look and feel is controlled in the DOCStudio template system.

Smaller Text

     <font class=s1>Small Text</font>

This tag's look and feel is controlled in the DOCStudio template system.

Larger Text

     <font class=s3>Large Text</font>

This tag's look and feel is controlled in the DOCStudio template system.

Paragraph Formatting

Line Break

     <br>

Note that the DOCStudio system will automatically insert html linebreaks if the checkbox is checked above the Page Body box.

Start New Paragraph

<p>

Note that the DOCStudio system will automatically insert html linebreaks if the checkbox is checked above the Page Body box.

Indented Paragraph

   <blockquote>

    Indented Text,

    Text, Text

  </blockquote>

Line

     <hr>

It's a good idea to avoid these; they tend to look unprofessional and also force the reader's eye to jump over a hurdle.

Bulleted List

    <ul>

    <li>First Bullet

    <li>Next Bullet ...

    </ul>

Use <li> for each bullet

Note: if you want a numbered list, use <ol> and </ol> instead of <ul> and </ul>

Centered Text

     <center>
 Centered Text
 </center>

Links

To Link to Another Page in the DOCStudio System

     <a href=/filename>Text that should link</a>

Replace "filename" with the filename of the page you are linking to.

To Link to Another Site or a Page on Another Site

     <a href=siteURL target=other>Text that should link</a>

Replace "siteURL" with the complete URL of the page you are linking to. You can get this by going to the page you want to link to and copy the URL from the location bar at the top of your browser.

Rules to Keep in Mind

Every text formatting tag has an opening tag () and a closing tag (). If you don't use the closing tag, all the following text will be formatted to the end of the document.

You can combine multiple formatting tags. However, be sure to balance the tags from inside-out; for instance: Text here is correct because the tags are wrapped around the text like gift wrap: the inner wrapping is italic, the outer wrapping is bold. Text here is not correct because the outside wrapper ends before the inside wrapper does. Think of a box you are gift wrapping and then wrapping with brown shipping paper.

If you want to format a link with bold, color, or another text format, put the link tag outside the text formatting; for instance: <a href=/coaching>Text here</a>.

In Closing

It is a good idea when you are first learning HTML to have your friends check your pages on their computers because every browser displays HTML slightly differently. What looks right on your browser may look broken on your friend's.

Don't sweat the small stuff -- experiment and have fun.