Pure HTML semantic acronyms

You can display the meaning of an acronym with pure HTML using the abbr semantic tag.

<abbr title="HyperText Markup Language">HTML</abbr>

For example:

<abbr title="HyperText Markup Language" style="cursor: default;">HTML</abbr> is the main language for displaying web pages.</p>

This code will introduce a small dotted border under the abbreviation, on mouse over you will see the full words.

In this way you don't need a javascript tooltip plugin and the semantic of the document is very clear for human readers, search-engines, screen-readers and automatic translators.

In some browsers, on mouse over, the cursor changes to text input style, you can avoid it with an easy css rule:

abbr:hover{cursor: default;}

Please note that HTML5 supports only abbr tag, the old acronym by HTML 4.01 is deprecated.