Hi Folks!
Ever seen a website with awesome icons such as : ?
Have you ever wondering how to make such thing? If so then great, you're in the right place. Let's get into it.
First of all, create or open up your HTML file. Let's say it's called 
index.html and it might look similiar to this :<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
  <meta charset="utf-8">
  <title>My Awesome Website</title>
</head>
<body>
</body>
</html>To do so, just copy the code below and place it right before your </head> tag :
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" />
</head>
index.html file would looks like this :<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
  <meta charset="utf-8">
  <title>My Awesome Website</title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" />
</head>
<body>
</body>
</html><i> with an icon class you can get from Here
Using class
Let's say you wanted to use arrow icon :<i style="font-size:24px" class="fa fa-arrows"></i>
Code above will gives you this : 
Using unicode
After checking the link I've given above, you might wondering what are those&#fxxx; right?
Simply, you also type those codes and it will automatically converted into certain icons.
<i style="font-size:24px" class="fa"></i> will gives you this : 

No comments:
Post a Comment