This lesson introduces a number of basic tags that allow an HTML page to be

formatted - much in the same way that word processors format documents. The
following topics are covered:

Character Formatting
Paragraphs
Paragraph Alignment
Forced Line Breaks
Spaces
Horizontal Rules

Character Formatting:
The Bold <B></B> element specifies that the enclosed text should be displayed in
boldface.

The Underlined <U></U> element specifies that the enclosed text should be
displayed underlined.

The Italic <I></I> element specifies that the enclosed text should be italicized.

Below are these HTML tags beside samples of their respective browser displays:
open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com
 HTML Code Browser Display

This text is <B>bold!</B> This text is bold!

This text is <I>italicized.</I> This text is italicized.

This text is
This text is underlined.
<U>underlined</U>.

Paragraphs
In HTML you indicate paragraphs with the <P> and </P> elements. Without these
elements the document becomes one long paragraph. Likewise, browsers ignore any
indentations or blank lines in the HTML code.

Thus the examples below, although coded differently, are all displayed the same
way:

HTML Code Browser Display

This is a very short

<P> This is a very short paragraph to illustrate my
paragraph to illustrate my point.
point.</P> <P>And this is
the second paragraph. </P> And this is the second
paragraph.

<P> Although this Although this is written

differently with lots of
open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com
 is written differently differently with lots of
with lots of carriage returns carriage returns it still only
it still only displays displays the paragraphs
the paragraphs when when you put in the
you put in the Paragraph Paragraph Tag.
Tag.</P> <P> Like so.</P>
Like so.

NOTE: The </P> closing tag may be omitted. This is because browsers understand
that when they encounter a <P> tag, it means that the previous paragraph has
ended.

To preserve readability when composing HTML files, separate paragraphs with blank
lines. As mentioned above, browsers will ignore blank spaces inserted into source
code.

Paragraph Alignment
Paragraph alignment can be manipulated by including either the RIGHT, LEFT, or
CENTER (note the Americanized spelling) attributes within the <P> tag as shown
below:

HTML Code Browser Display

<P ALIGN=left> This

This paragraph is left
paragraph is left aligned.
aligned.
</P>

<P ALIGN=CENTER> This is a This is a centered

centered paragraph. </P> paragraph.

<P ALIGN=RIGHT> This

This paragraph is right
open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com
 This paragraph is right
paragraph is right aligned.
aligned.
</P>

Forced Line Breaks

The line break tag <BR> can be used to control how browsers render text. When an
HTML document is viewed the text normally does a word-wrap at the end of a line.
If a text break is desired before the end of a line, use the <BR> tag to force a line
break without any extra space between lines. This element has no closing tag.

HTML Code Browser Display

CN Tower<BR>
CN Tower
301 Front Street West<BR>
301 Front Street West
Penthouse<BR>
Penthouse
Toronto, Ontario M5V
Toronto, Ontario M5V 2T6
2T6<BR>
Canada
Canada<BR>

Using the <P> tag instead of the <BR> tag for short lines of text, such as the
above example, would have resulted in unwanted additional white space.

Horizontal Rules
The horizontal rule <HR> tag produces a horizontal line the width of the browser
window. Horizontal rules are useful for separating major sections of a document.
The length of a rule can be varied by using the "WIDTH=" and "SIZE=" attributes.

open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com
 HTML Code Browser Display

Horizontal Rules rule!<HR Horizontal Rules rule!

SIZE=3 WIDTH=80%>

There are two other attributes that can be used with the <HR> tag. They are:

ALIGN= RIGHT, LEFT, or CENTER

NOSHADE Causes the rule to appear solid black.

Try it out!
In the box below, type the following HTML code, then click the "View" button. The
HTML document you have written will be displayed in your browser. You may wish
to change some of the tags and/or attributes to experiment with some of the
different items discussed in this lesson.

Try typing this:

<HTML>

<HEAD>
<TITLE>HTML</TITLE>
</HEAD>

<BODY BGCOLOR="#800080" TEXT="#FFFFFF">

Learning HTML is <B>so</B> much fun!

<P ALIGN=center>
And it is really <I>easy</I> once you get the hang of it.
open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com
 </P>
<HR SIZE=3>
</BODY>

</HTML>

View Erase

`ˆÌi`ÊÜˆÌ ÊÌ iÊ`i“œÊÛiÀȜ˜ÊœvÊ
˜vˆÝÊ*ÀœÊ* Ê `ˆÌœÀÊ

/œÊÀi“œÛiÊÌ ˆÃʘœÌˆVi]ÊۈÈÌ\Ê
ÜÜÜ°ˆVi˜ˆ°Vœ“É՘œVŽ° ̓
open in browser PRO version Are you a developer? Try out the HTML to PDF API pdfcrowd.com