-1

I wanna use the font awesome icons offline in webpage but it is not happening dont know the exact reason as my code goes here

<html>
<head>
    <title>font-awesome example</title>
    <link rel="stylesheet" type="text/css" href="css/font-awesome.min.css" />
</head>
<body>


this is example about font-awesome<i class="fa fa-bell"></i>

<br>
this is not working
</body>
</html>

please any one put me on right way to get font awesome on my page

rch
  • 345
  • 1
  • 6
  • 20

3 Answers3

2

Have you downloaded the fonts folder as well? All the font awesome icons are included in font files which the browser expects to find in a directory called 'fonts'.

If you've only included the css file the page won't find the actual fonts and the icons won't load.

Shtut
  • 1,397
  • 2
  • 14
  • 28
1

I faced similar issues. I realized I just went straight to copying the target CSS file path front the font awesome icons which doesn't display. Just the box outline. Solution is copying the whole folder you extracted after download to your work (HTML/CSS) portfolio and access the target fontawesome.CSS or all.CSS file using the './' file path access. It will work like it's online. Good luck.

Bonn Umunna
  • 11
  • 1
0

The /css/all.css file contains the core styling plus all of the icon styles that you’ll need when using Font Awesome. The /webfonts folder contains all of the typeface files that the above CSS references and depends on.

Copy the entire /webfonts folder and the /css/all.css into your project’s static assets directory (or where ever you prefer to keep front end assets or vendor stuff).

Add a reference to the copied /css/all.css file into the of each template or page that you want to use Font Awesome on.

visit - https://fontawesome.com/how-to-use/on-the-web/setup/hosting-font-awesome-yourself

Dipesh Chauhan
  • 21
  • 1