Skip to content

Instantly share code, notes, and snippets.

@nathansmith
Created December 14, 2011 15:26
Show Gist options
  • Save nathansmith/1477017 to your computer and use it in GitHub Desktop.
Save nathansmith/1477017 to your computer and use it in GitHub Desktop.
Terse Font Icons
a[data-icon]:before,
span[data-icon]:before {
font-family: 'Icon Font Here';
content: attr(data-icon);
}
/*
This would also work, but other web developers might
yell at you about "performance" which may/not matter:
*/
*[data-icon]:before {
font-family: 'Icon Font Here';
content: attr(data-icon);
}
<!-- Assuming "+" is your font's Add icon -->
<a data-icon="+" href="...">
Add
</a>
<!-- Assuming "D" is your font's Delete icon -->
<span data-icon="D">
Delete
</span>
@nathansmith
Copy link
Author

Nope, no good reason, really. Just a cut-and-paste from my text editor. :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment