Basic HTML Formatting

Background

The XHTML standard allows for very flexible text formatting, but this uses a different approach than the "old-school" styles of HTML. We will not use the older tags such as center and font. Instead, we'll rely on the STYLE tag.

Changing a paragraph's foreground color

This paragraph is blue

code:

<p style = "color: blue">
This paragraph is blue
</p>

Changing a paragraph's background color

This paragraph is on a yellow background

code:

<p style = "background-color: yellow">
This paragraph is on a yellow background
</p>

Changing foreground and background color

This paragraph is blue on a yellow background

code:

<p style = "color: blue";
            background-color: yellow">
This paragraph is blue on a yellow background
</p>

Changing Font Family

This paragraph is in Comic Sans, or in cursive if Comic Sans is not available. (The cursive font is generic)

code:


<p style = "font-family: Comic Sans MS, Cursive">
This paragraph is in Comic Sans, or in cursive if Comic Sans is not
available.  (The cursive font is generic)
</p>

Changing Font Size

This paragraph is in 30 pts if possible

code:


<p style = "font-size: 30pt">
This paragraph is in 30 pts if possible
</p>

Changing Text Alignment

This paragraph is centered

code:


<p style = "text-align: center">
This paragraph is centered
</p>

Combining everything

This paragraph is right-justified,
with blue text on a yellow background,
using a 20 pt Comic Sans Font

code:


<p style = "text-align: right;
            font-family: Comic Sans MS;
            font-size: 20pt;
            color: blue;
            background-color: yellow">
This paragraph is right-justified, <br />
 with blue text on a yellow background, <br />
 using a 20 pt Comic Sans Font
</p>