Использование глиф-шрифтов в CSS

Question

Я пытаюсь использовать шрифт.woff от Icomoon, чтобы добавить глифы к различным элементам на странице. Но как их использовать? Вот что я попробовал:

fonts.less

@font-face {
  font-family: 'Icomoon';
  font-style: normal;
  font-weight: 400;
  src: local('Icomoon'), local('Icomoon'), url('fonts/Icomoon.woff') format('woff');
}

header
{
   #steps span
   {
       font-family: Icomoon;
   }
}

index.php

....
<header>
   <ul id="steps">
       <li><span>A</span> Sign Up</li>
   </ul>
</header>
....

Кажется, шрифт изменился, но глифа нет. Набор иконок, который я использую, - IcoMoon Free from: http://icomoon.io/app/

Я что-то здесь упускаю? Я использую Bootstrap и надеялся включить их так же, как Bootstrap (без необходимости включать букву с тегами span).

Есть идеи?

Answer 1

Шрифты могут быть болью, но иногда,

Я использую генератор шрифтов squirrels webfont:

http://www.fontsquirrel.com/tools/webfont-generator

Это должно работать!