не могу отобразить значки Font Awesome?

Я только начал использовать Font Awesome в своем приложении MVC, в котором уже есть Bootstrap. Мне нужно использовать некоторые значки, и я скопировал font-awesome.css в свой проект, но значки не видны. Я включил только этот css, не уверен, но хочу спросить, есть ли какие-то другие файлы для включения?

Вот как это видно на моей странице: введите здесь описание изображения

Только что проверено в Firebug, и его отображение на панели css выглядит следующим образом: введите здесь описание изображения

Пожалуйста, направьте, как я могу это исправить.

Спасибо за вашу помощь и руководство


twitter-bootstrap asp.net-mvc font-awesome font-awesome-4 font-awesome-3.2
person Toubi    schedule 10.02.2014    source источник
comment
вам нужно включить весь каталог, или лучший способ - это ссылка на внешний css, который находится на сервере fontawesome.   -  person Zafar    schedule 10.02.2014
comment
@Zafar, вы имеете в виду включить весь каталог и ссылаться только на файл css? Пожалуйста, нужна ли какая-либо другая конфигурация?   -  person Toubi    schedule 10.02.2014
comment
да. включать все каталоги и ссылаться только на font-awesome.css. никаких других настроек.   -  person Zafar    schedule 10.02.2014
comment
@Зафар, спасибо. Только одно, пожалуйста, нужны ли все эти файлы и папки? В нем 4 папки css, fonts, less, scss, но я буду использовать только некоторые значки. Что-нибудь лишнее, что я могу удалить для повышения производительности? Пожалуйста, направляйте   -  person Toubi    schedule 10.02.2014
comment
вы можете удалить less и scss, если у вас есть папка css и fonts.   -  person Zafar    schedule 10.02.2014
comment
@ Зафар, извини, что задаю много вопросов. Нужно ли в производстве заменять css и шрифты на less и scss? На самом деле я не уверен, для чего нужны less и scss? Не могли бы вы направить немного больше.   -  person Toubi    schedule 10.02.2014
comment
тем самым вы готовы к производству. забудьте о меньшем и scss. из них сделаны font-awesome.css. пока они уже скомпилированы в .css, они вам больше не нужны (если только вы не внесете некоторые изменения в fontawesome).   -  person Zafar    schedule 10.02.2014
comment
давайте продолжим обсуждение в чате   -  person Toubi    schedule 10.02.2014
comment
Чтение документации помогает fortawesome.github.io/Font-Awesome/get-started   -  person Chris Pratt    schedule 10.02.2014

Ответы (3)


arrow_upward
7
arrow_downward

У вас должен быть доступ к каталогу fonts, к которому можно получить доступ на вашем веб-сервере. Он включен в пакет загрузки с http://fortawesome.github.io/Font-Awesome/

Внутри font-awesome.css ему необходимо обратиться к каталогу fonts, чтобы отобразить изображение значка.

Надеюсь это поможет.

person rasyadi    schedule 10.02.2014
comment
спасибо, подскажите, что такое меньше и scss? Нужно ли мне исключать или включать какие-либо файлы, особенно в производственной среде? - person Toubi; 10.02.2014
comment
Если вы используете только css, вам не понадобятся каталоги less и scss. Эти каталоги предназначены для тех, кто хочет использовать Less и Sass, которые являются препроцессором CSS и расширением CSS соответственно. - person rasyadi; 10.02.2014
comment
@rasyadi, можешь исправить эту ссылку? Кажется, это 404ing. Мы хотим убедиться, что ответы, которые мы публикуем, будут полезны в будущем. Спасибо! - person imjared; 10.02.2014
comment
Фиксированный. Мои извинения за неправильный URL, я пропустил относительный путь. - person rasyadi; 10.02.2014

arrow_upward
3
arrow_downward

Кроме того, я заметил, что мне нужно указать расположение папки в «font-awesome.css», где найти каталог, если вы создали его для хранения всех файлов шрифтов. Вы можете проверить это, чтобы убедиться, что он ищет в правильном месте, а также убедиться, что у вас есть ссылка на «пакеты» в App_Start и Shared/_Layout.cshtml.

    @font-face {
      font-family: 'FontAwesome';`enter code here`
      src: url('../Content/fonts/fontawesome-webfont.eot?v=4.2.0');
      src: url('../Content/fonts/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'), url('../Content/fonts/fontawesome-webfont.woff?v=4.2.0') format('woff'), url('../Content/fonts/fontawesome-webfont.ttf?v=4.2.0') format('truetype'), url('../Content/fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular') format('svg');
      font-weight: normal;
      font-style: normal; 

     }
person Sean    schedule 12.09.2014

arrow_upward
0
arrow_downward

Любой, кто все еще ищет альтернативный ответ, этот метод, предложенный в другом ответе StackOverflow, решает проблему.

В основном измените действие «Сборка» для файлов .eot, .ttf и .woff на «Содержание» вместо значения по умолчанию «Нет». Это решило мою проблему.

person Umair    schedule 22.09.2017