The easy way to use fontAwesome
- link the CDN or the file in you asset as a css library link
- use inside the html the
and it is done!
What if you have a lot icons to insert inside your project? Could be boring to death using over and over again the
itag inside the
html! For this reason I love to use this “easy way”:
- do the same as the step number one
- insert in your
body tagthe code below (you may use a different font inside each class):
font-family: 'your-favourite-font', fontAwesome, sans-serif;
- use the cheatsheet code with format
needed that you can get from cheatsheet code list. Add in your html and you will get the same result.
For example if I have to add some icons to my menu I can do that in my html:
<div class="nav simple-way"> <ul> <li> Home</li> <li> About me</li> <li> Contact me</li> </ul> </div>
and I only need the previous code inside my css:
font-family: 'you-favourite-font', fontAwesome, sans-serif;
And is done as you can see in my following pen:
isn’t it really cool?
Do you like this methodology or you have some other tip to share?