CSS内容中的FontAwesome图标

Question

So I just asked this question , and it works fine. But when I thought; what if I try to put font-icons or glyphs into css' content property?

Here's the fiddle . So is this even possible, how do I get a fontawesome icons to render in css' content property?

.item a p.new-label span{
  position: relative;
  content: 'NEW'
}
.item:hover a p.new-label span{
  display: none;
}
.item:hover a p.new-label:after{
  content: '\f014';
}

Thank you for your help in advance.

Answer 1

You just need to set the font-family in your .item:hover and you'll be good to go.

http://jsfiddle.net/bhlaird/JfGVE/13/

.item:hover a p.new-label:after {
    font-family:FontAwesome;
    content:'\f014';
}