HTML abbr and acronym Tag
By Stephen Bucaro
The <abbr> and <acronym> tags allow you to give information about the meaning
of an abbreviation or acronym used in your text without disrupting the flow of text by placing
the information directly in the text. This is done by putting the information in the tag's title
attribute. The browser will then display the information as a tooltip.
The first thing you might ask is; what's the difference between an abbreviation and an acronym?
Well, they're both a group of letters used as a shortened forms of a word, phrase or name.
Whereas an abbreviation can be anything you desire, its purpose being to replace the word or
phrase in the text, an acronym is usually a standard group of letters used by everyone and that
standard group of letters is usually articulated as a standard word.
Here's an example use of the <abbr> tag:
In the csmdb you can configure
your Start menu.
In the <abbr title="Customize Start Menu dialog box">csmdb</abbr> you can configure
your Start menu.
Here's an example use of the <acronym> tag:
Because of its age, NASA has decided
to retire the Space Shuttle.
Because of its age, <acronym title="National Aeronautics and Space Administration">NASA<acronym> has decided
to retire the Space Shuttle.
By the way, I know the above sentence is bad grammar, but I wanted to put the acronym in the middle
of the sentence. Also, you don't need the <abbr> or <acronym> tags to create a tooltip,
you can add the title attribute to span (or almost any other html element) and you'll get a tooltip,
but only the <abbr> or <acronym> tags will display the dotted underline to indicate that
a tooltip is available.
More HTML Code:
• HTML DIV Basics
• HTML Image Basics
• HTML5 role Attribute
• Use HTML Target Attribute to Specify Where to Open Document
• The HTML BODY tag
• HTML List Basics
• Adding Space Around an Image
• Webpage DOCTYPE Declarations Explained
• Use Datalist Tag to Specify Pre-defined Text for Input Element
• Aligning an Image on Your Web Page
| 
About BTH
User Agreement
Privacy
Site Map
Contact
News Feeds
Follow @Stephen Bucaro
General Web Design
