HTML Basics

Contents

What is HTML?
Basic Layout
Your first HTML document
Color and Style
Adding Images
Creating links
Tables
Forms
Lists
Special Characters
Putting your page on the Internet
HTML Links

Text formatting tags

As stated previously, a valid HTML document can consist of only 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 as typed. The browser uses it's default text color and font to display your text. But that isn't very exciting. HTML contains a rich set of text formatting tags that you can use to manipulate the text in whatever format you can dream up. We'll cover the common ones here.

Headline tags ( <h1> ... <h6> )
These tags are typically used to quickly format headers. For instance, <h3>Chapter 1</h3>. 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 follows the headline appears on the next line in the browser.

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> or <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. This tag does not produce a line break.
Italic tag (<i>)
Makes text italic. This tag does not produce a line break.

Font tag (<font>) Note: This tag is deprecated in favor of <STYLE> tag
Although this tag may be deprecated, it is still widely used in html documents across the web and therefore worth noting here. The 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
This tag does not produce a line break.

Block of text tag (<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>) Note: This tag is deprecated in favor of <STYLE> tag
Underlines text. This is not a line-breaking tag.

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 produce this exercise.

I'm being a little Sneaky though, because I'm actually using tags that you haven't learned yet, to achieve 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 >>