6. HTML Formatting

 

If you use a word processor, you must be familiar with the ability to make text bold, italicized, or underlined; these are just three of the ten options available to indicate how text can appear in HTML and XHTML.

Bold Text

Anything that appears within ... element, is displayed in bold as shown below:

Example

The following word uses a bold typeface. This will produce following result:

The following word uses a bold typeface.

Italic Text

Anything that appears within ... element is displayed in italicized as shown below:

Example

The following word uses a italicized typeface. This will produce following result:

The following word uses a italicized typeface.

Underlined Text

Anything that appears within ... element, is displayed with underline as shown below:

Example

The following word uses a underlined typeface. This will produce following result:

The following word uses a underlined typeface.

Strike Text

Anything that appears within ... element is displayed with strikethrough, which is a thin line through the text as shown below:

Example

The following word uses a strikethrough typeface. This will produce following result:

The following word uses a strikethrough typeface.

Monospaced Font

The content of a ... element is written in monospaced font. Most of the fonts are known as variable-width fonts because different letters are of different widths (for example, the letter 'm' is wider than the letter 'i'). In a monospaced font, however, each letter has the same width.

Example

The following word uses a monospaced typeface. This will produce following result:

The following word uses a monospaced typeface.

Superscript Text

The content of a ^... element is written in superscript; the font size used is the same size as the characters surrounding it but is displayed half a character's height above the other characters.

Example

The following word uses a superscript typeface. This will produce following result:

The following word uses a ^superscript typeface.

Subscript Text

The content of a _... element is written in subscript; the font size used is the same as the characters surrounding it, but is displayed half a character's height beneath the other characters.

Example

The following word uses a subscript typeface. This will produce following result:

The following word uses a _subscript typeface.

Inserted Text

Anything that appears within ... element is displayed as inserted text.

Example

I want to drink cola wine This will produce following result:

I want to drink
colawine

Deleted Text

Anything that appears within ... element, is displayed as deleted text.

Example

I want to drink cola wine This will produce following result:

I want to drink
colawine

Larger Text

The content of the ... element is displayed one font size larger than the rest of the text surrounding it as shown below:

Example

The following word uses a big typeface. This will produce following result:

The following word uses a big typeface.

Smaller Text

The content of the ... element is displayed one font size smaller than the rest of the text surrounding it as shown below:

Example

The following word uses a small typeface. This will produce following result:

The following word uses a small typeface.

Grouping Content

The

and elements allow you to group together several elements to create sections or subsections of a page.
For example, you might want to put all of the footnotes on a page within a

element to indicate that all of the elements within that

element relate to the footnotes. You might then attach a style to this

element so that they appear using a special set of style rules.

Example

id="menu" align="middle" > href="/index.htm">HOME | href="/about/contact_us.htm">CONTACT | href="/about/index.htm">ABOUT

id="content" align="left" bgcolor="white">

Content Articles

Actual content goes here..... This will produce following result:

HOME | CONTACT | ABOUT

Content Articles

Actual content goes here.....

The element, on the other hand, can be used to group inline elements only. So, if you have a part of a sentence or paragraph which you want to group together, you could use the element as follows

Example

This is the example of style="color:green">span tag and the style="color:red">div tag alongwith CSS This will produce following result:

This is the example of span tag and the div tag alongwith CSS

These tags are commonly used with CSS to allow you to attach a style to a section of a page.

• Tweet
• Share
• Share
• Share
• Share