Abbreviations

Stylized implementation of HTML’s <abbr> element for abbreviations and acronyms to show the expanded version on hover. Abbreviations with a title attribute have a light dotted bottom border and a help cursor on hover, providing additional context on hover.

Basic abbreviation

For expanded text on long hover of an abbreviation, include the title attribute with the <abbr> element.
Example

<abbr title="attribute">attr</abbr>

Output
Untitled


Initialism

Add .initialism to an abbreviation for a slightly smaller font-size.
Example

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

Output
Untitled

Share

You may also like...