2015-05-22 2 views
0

Я пытаюсь вставить значок FontAwesome через css с помощью Юникода, и моя страница отображает его как текст. Поэтому, если значок Unicode для дома - f015, в моем браузере отображается «/ f015» вместо отображения значка дома.Font Awesome unicodes, отображающий как текст

заголовок HTML включает в себя:

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css"> 

CSS:

#MenuBarLink1 a:before { 
     position: absolute; 
     left: 1em; 
     padding: 0 1px; 
     font-family: FontAwesome; 
     content: "/f015"; 
     -webkit-transform: translateZ(0); 
     transform: translateZ(0); 
     -webkit-transition-duration: 0.1s; 
     transition-duration: 0.1s; 
     -webkit-transition-property: transform; 
     transition-property: transform; 
     -webkit-transition-timing-function: ease-out; 
     transition-timing-function: ease-out; 
    } 

мне интересно, если мне нужно сделать что-нибудь, чтобы объявить семейство шрифтов, кроме просто включая эту ссылку в моем HTML заголовок. Я загрузил все файлы шрифтов Awesome, но я использую только онлайн-ссылку, потому что я читал, что это было лучше.

Спасибо, что помогли newb! :)

+0

Вы разрабатываете локально (файл: //)? – crc442

+0

У вас есть набор символов, установленный на utf-8? – user2182349

+0

Я развиваюсь локально, и да, мой заголовок включает мета-чарсет utf-8 Иконки прекрасно работают, когда я помещаю их в html (fa fa-home), но пока не получил их для работы через css. – TJBlackman

ответ

1

Я думаю, вы используете неправильную косую черту. Использование,

content : '\f015'; 
+0

Вы были правы. И я чувствую себя очень глупо. К сожалению, теперь с правильной косой чертой, я получаю только пустоту, а не фактическую иконку. Пробовал пару паролей. Я постараюсь ответить на это самостоятельно, но если вы знаете, это тоже будет полезно. – TJBlackman

+0

Исправлено, добавив ссылку на мои локальные файлы FontAwesome, а не только ссылку на источник в Интернете. Это потому, что я развиваюсь локально? – TJBlackman

+0

Yup. Вы могли бы добавить http: // в href. Это тоже сработало. – crc442