How does one implement something like Acronym in HTML5?

Question

Given that acronym is removed in HTML 5, how does one get standards support with similar functionality? Every other removed tag looks like CSS can do it, but that one seems to be removed completely...

Answer 1

<abbr> has been repurposed for both abbreviations as well as acronyms:

The abbr element represents an abbreviation or acronym, optionally with its expansion.

If you want to be specific with your semantics, perhaps adding class="acronym" would do the trick. I think that's as far as you can go, although I should add that class has no actual semantic value whatsoever.

Answer 2

I thought <abbr> replaced <acronym>?

http://www.html-5.com/tags/abbr-tag/

Answer 3

Can you clarify exactly what you're trying to make it look like? The default style for <acronym> differs across browsers. Opera uses a dotted underline and Chrome doesn't style it all, for example. Are you trying to emulate a particular browser's default style?

However, if you mean the tooltip-style message that appears on mouse hover, you should be able to use the same attribute in <abbr> as before: title="your acronym's definition".

Answer 4

The acronym element was folded into the abbr element, because

1. most HTML authors didn't know the difference between an acronym and an abbreviation and thus used them wrongly and
2. for the use cases of those two elements, the difference between an acronym and an abbreviation are irrelevant anyway.