What does 'content: "\f110" ' mean (importing custom fonts)?
css, fonts
Solution
That is a CSS declaration to enable you to use a shortcut like `<span class="fa-spinner">` to produce a spinner icon. The `content:` CSS property means "place this content in this element, and the `:before` pseudoclass is used to place it before any content you might actually place in such a `<span>` in your markup.
`\f110` is an escape sequence used to produce a character by its hexadecimal representation. It refers to the Unicode character at codepoint U+F110. This is in the "private use range", a range of character codes you're allowed to use for your own arbitrary symbols that don't necessarily correspond to any other character, such as a spinner icon. You can produce the same character in your markup without the assistance of CSS by simply using the equivalent HTML numeric character reference, ``
Problem
I was looking at the font-awesome source to quickly get an idea of how importing fonts and graphics works. I found the line: ``` .fa-spinner:before { content: "\f110"; } ``` How does this refer to the spinner icon? Where can I read about creating my own fonts and icons and using them?