As we said before, a valid HTML document only needs the html tag.
You may type any text between the
html start and end tag without any other tags and it will display in
the browser just as you typed it. The browser uses it's default text
color and font to display your words. But that isn't very exciting.
HTML contains a rich set of text formatting tags that you can use to
display the text in just about any format you can dream up. We'll
cover the common ones here.
- Headline tags (
<h1></h1> ... <h6></h6> )
- These tags are used to quickly make headers.
For instance...
<h3>Chapter 1</h3> looks like this...
Chapter 1 The
headline tags range from 1 to 6 in decreasing size and boldness.
These tags are what's called line-breaking tags. That is, whatever
comes after the header is on the next line in the browser, no matter what.
- Paragraph tag (<p>)
- Starts a new paragraph or line. This tag
does not require an end tag unless you're specifying a style
(covered in the next section) for the entire paragraph. Then, you
should use it to tell the browser when to end the paragraph.
- Boldface tag (<b></b> or <strong></strong>)
- The <b> tag is used to make text
bold. The <strong> tag is used to give emphasis to text. In
almost every case, that means bold. For instance...
<b>This is bold</b> looks like this... This is bold
<strong>This is strong</strong> looks like this... This is strong
This tag does not cause a line break.
- Italic tag (<i></i>)
- Makes text italic. For example...
<i>Italic text</i> looks like Italic text
This tag does not cause a line break.
- Font tag (<font></font>)
- This tag is used to specify size, color, and font style of text.
For example
<font size="2" color="red" face="Courier">font example</font>
would look like this font example
(Note: The W3C recommends using font style properties instead of this tag.)
This tag does not cause a line
break.
- Block of text tag (<blockquote></blockquote>)
- Creates an indented block of text. I used
it in the font tag example above. Notice how the example is
indented. This is a line-breaking tag.
- Underline tag (<u></u>)
- Underlines text.
(Note: The W3C recommends using text style properties instead of this tag.)
This tag does not cause a line break.
As an exercise, try duplicating the following paragraph using the
tags just discussed. Put it in a file called texttags.html. No cheating.
Text Formatting Tags Example
This is a very simple exercise
to test your comprehension of these common
text formatting tags. I'm showing uses of every tag discussed in this
section to make this exercise. I'm being a little
Sneaky though, because
I'm actually using tags that you haven't learned yet, to create this look. I'm not trying to
confuse you though. I'm just hoping you get this on your own. Good Luck!
Next, we'll discuss how to add color and style in more detail...
Next >> |