FontAwesome import tricks | Block square error

So in this article
we will see how to use FontAwesome without having a lot of code  and manipulate the styles

So How font awesome works
It has its own Fonts
It has its own css classes .
then we import font awesome and write

so these fa and fa-facebook classes are defined in their css file and they will show it to you

Lets Do How we can manipulate if we want something else out of it


1. Import this css in your CSS file at the top

 @import url("http://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css");  

2.  in html define your class

3. in css create myIconClass

 .myIconClass{  
  content: "\f000";  
  font-family: FontAwesome;  
  font-style: normal;  
  font-weight: normal;  
  text-decoration: inherit;  
 /*--adjust as necessary--*/  
  color: #000;  
  font-size: 18px;  
  padding-right: 0.5em;  
  position: absolute;  
  top: 10px;  
  left: 0;  
 }  

change the content
You can inspect element on chrome and read the content value from their website