• Home
• About
• FAQ
• Contact
• Link
• Sitemap
• Forums

1. HTML intro
2. Web pages and you

1. HTML getting started
2. HTML basics
3. HTML document

1. HTML text formatting 1
2. HTML text formatting 2
3. HTML text formatting 3
4. HTML fonts
5. HTML entities

1. HTML links
2. HTML email links

1. HTML images
2. HTML image maps

1. HTML forms
2. HTML form labels
3. HTML fieldset/legend

1. HTML tables
2. HTML tables concepts

1. HTML frames

1. HTML backgrounds
2. HTML colors
3. HTML color shades
4. HTML color usage

1. HTML stylesheets
2. HTML div/span

1. HTML audio
2. HTML video
3. HTML objects
4. HTML download media

1. HTML head section
2. HTML meta tags
3. HTML scripts
4. HTML declarations
5. HTML document types

1. HTML tag rules
2. HTML things to avoid
3. URL formatting
4. URL encoding/decoding
5. HTML use/access
6. HTML publish work

1. HTML marquees

1. HTML history
2. HTML summary

HTML text formatting (part 1)

Text in an HTML document can be formatted in many ways such as changing the texts size, color, and font type, as well as advanced formatting such as creating lists, paragraphs, and line breaks.

As text formatting in HTML is a huge topic with alot of possibilities, we have written three text formatting tutorials.

You can skip ahead to Text formatting part 2 or Text formatting part 3 right away though it is recommended to read the text formatting tutorials in order.

This tutorial focuses on:

• The <font> tag
• Bold, italic, and underlined text
• Headings
• Big and small text
• Centering text
• Abbreviations and Acronyms
• Addresses
• Computer output tags

The <font> tag

The <font> tag is used to set text size, font type, and color. It takes three attributes - size, face, color.

NOTE: This tag is deprecated.

Bold, italic, and underlined text

The <b> tag makes text bold, the <i> tag makes text italic, and the <u> tag underlines text.

Headings

Headings can be displayed using the <h1> through <h6> tags. The lower the number in a heading tag, the bigger the heading.

Heading tags: <h1> (biggest heading), <h2>, <h3>, <h4>, <h5>, <h6> (smallest heading)

NOTE: The browser will automatically place a line break before and after each heading.

NOTE: Headings should be used to present the logical order of a document and used in order - <h1> as a main heading, then <h2>, then <h3>, and so on. Our pages are an example of this - we have the title of the page in an <h1> heading, and the title for each part of the page (subtitles) in an <h2> heading. Do not use headings to simply display text in a certain size.

Big and small text

You can display big text using the <big> tag and small text using the <small> tag.

The <big> tag will display text as only a little bigger than its regular size, and the <small> tag will display text as only a little smaller than its regular size.

Centering text

You can center text (as well as other elements) using the <center> tag.

NOTE: This tag is deprecated.

Abbreviations and acronyms

Abbreviations

Abbreviations are specified with the <abbr> tag. This tag is used to display the value of data which is abbreviated. The <abbr> tag contains a title attribute that sets what the data is an abbreviation of.

Move your mouse over 'Intro.' to find out what it is an abbreviation of. A small box (called a tooltip) with the abbreviation should appear right next to the word.

Acronyms

Acronyms are specified with the <acronym> tag. This tag works similarly to the <abbr> tag but is used to display the value of data which is displayed as an acronym. The <acronym> tag contains a title attribute that sets what the data is an acronym of.

Move your mouse over 'BASIC' to find out what it is an acronym of. A small box (called a tooltip) should appear with the acronym right next to the word.

Addresses

Addresses are placed on a webpage with the <address> tag.

NOTE: The <address> tag automatically sets text to be italic.

Computer output tags

Computer output tags are used to display text as computer programming code.

Computer output tags: <code>, <kbd>, <tt>, <samp>, <var>