Use Fontice Icons in CSS

How to Use Fontice Icons in CSS

Use fontice icon in photoshop

How to use fontice icons in CSS code

(1) Include CSS File

The first step is to include fontice-iconsfont.css in your the head of your HTML. Make sure you change the path to point to the file on your server.

<link rel='stylesheet' href='yourpath/fontice-iconsfont.css' />

(2) Change path in css

open “fontice-iconsfont.css” Again, ensure that the path to the files matches the setup on your server.

@font-face {
font-family: ‘Fontice-IconsFont’;
src: url(‘../yourpath/Fontice-IconsFont.eot?v=1.0’);
src: url(‘../yourpath/Fontice-IconsFont.eot?v=1.0#iefix’) format(’embedded-opentype’),
url(‘../yourpath/Fontice-IconsFont.ttf?v=1.0’) format(‘truetype’),
url(‘../yourpath/Fontice-IconsFont.woff?v=1.0’) format(‘woff’),
url(‘../yourpath/Fontice-IconsFont.svg?v=1.0#Fontice-IconsFont’) format(‘svg’);
font-weight: normal;
font-style: normal;}

(3) CSS Integration

.classname{position:relative;}
.classname:before{
content:”\e919″;
font-family:”Fontice-IconsFont”;
left:0px;
position:absolute;
top:0;
}

Done!