Я переношусь из bootstrap 2.3 в bootstrap 3, и все работает хорошо. Но когда я попытался добавить несколько значков, шрифт значка отображается неправильно. Я попытался посмотреть здесь http://bootply.com/61521, и отображается только ".glyphicon-envelope". Другие отображались как "E001" и т.д.
Как я могу решить эту проблему?
Для других браузеров глификоны отображаются правильно, только firefox не может отображать его правильно.
ОК, на мою проблему не ответили выше. У меня была папка с шрифтами в том же месте, что и папки bootstrap css и js (например,/theme/bootstrap3/..), но она искала папку шрифтов в корне (например,/fonts/glyph...off)
Решение для меня состояло в том, чтобы установить переменную @icon-font-path в правильный относительный путь:
Например, @icon-font-path: "fonts/";
Вы выбрали настроенную версию Bootstrap? Существует проблема с тем, что файлы шрифтов, включенные в индивидуальный пакет, повреждены (см. https://github.com/twbs/bootstrap/issues/9925). Если вы не хотите использовать CDN, вам необходимо загрузить их вручную и заменить свои собственные шрифты на загруженные:
https://netdna.bootstrapcdn.com/bootstrap/3.0.0/fonts/glyphicons-halflings-regular.svg https://netdna.bootstrapcdn.com/bootstrap/3.0.0/fonts/glyphicons-halflings-regular.woff https://netdna.bootstrapcdn.com/bootstrap/3.0.0/fonts/glyphicons-halflings-regular.ttf https://netdna.bootstrapcdn.com/bootstrap/3.0.0/fonts/glyphicons-halflings-regular.eot
После этого попробуйте сильную перезагрузку (CTRL + F5), надеюсь, что это поможет.
значки и css теперь выделены из бутстрапа. вот скрипка, которая из другого ответа stackoverflow
@import url("//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc2/css/bootstrap-glyphicons.css");
Вот исправление, которое сработало для меня. В Firefox есть политика происхождения файлов, которая вызывает это. Для устранения выполните следующие действия:
Подробнее: http://stuffandnonsense.co.uk/blog/about/firefoxs_file_uri_origin_policy_and_web_fonts
Вы увидите эту проблему только при доступе к файлу с помощью файла:///protocol
У меня была такая же проблема с использованием локального сервера apache. Это решило мою проблему:
http://www.ifusio.com/blog/firefox-issue-with-twitter-bootstrap-glyphicons
Для Amazon s3 вам необходимо отредактировать конфигурацию CORS:
<CORSConfiguration>
<CORSRule>
<AllowedOrigin>*</AllowedOrigin>
<AllowedMethod>GET</AllowedMethod>
<MaxAgeSeconds>3000</MaxAgeSeconds>
<AllowedHeader>Authorization</AllowedHeader>
</CORSRule>
</CORSConfiguration>
Прежде всего, я пытаюсь установить шрифты глификонов "официальным" способом с помощью zip файла. Я не мог этого сделать.
Это мое пошаговое решение:
Однако, для более легкого доступа, это ссылка файла woff.
http://getbootstrap.com/dist/fonts/glyphicons-halflings-regular.woff
В итоге я перешел на Font-Awesome Icons. Они так же хороши, если не лучше, и все, что вам нужно сделать, это ссылка на шрифт, счастливые дни.
убедитесь, что имя папки, содержащей имя шрифта, - это "шрифты", а не "шрифт"
вы можете использовать тег следующим образом:
<i class="fa fa-edit"></i>
На всякий случай:
Например, я просто попробовал <span class="icones glyphicon glyphicon-pen">
и через час я понял, что этот значок не был включен в пакет bootstrap!! В то время как значок конверта работал нормально.
Надеюсь, что это поможет
Как отмечали другие, в настройке есть некоторые проблемы.
У меня были проблемы с глификонами, которые не отображались, а также проблемы с макетом navbar.
Я использовал предложение и загрузил шрифты из полного zip/перезаписал те из настраиваемой версии и исправил проблемы с значками.
Я также потянул в CDN CSS и javascript вместо своей локальной копии из CDN. Это устранило проблемы с навигацией.
Поэтому я рекомендую, пока вы не получите зависание Bootstrap, а не используете настроенную версию, так как вы можете получить некоторые неприятные, нежелательные результаты.
Для размещения моей папки шрифтов в соответствии с местоположением, указанным в bootstrap.css, была решена проблема
В основном его папка шрифтов должна находиться в родительском каталоге файла bootstrap.css.
Я столкнулся с этой проблемой и изучил многие ответы, если кто-то еще в 2015 году сталкивается с этой проблемой, то это либо проблема с CSS, либо несоответствие местоположения для файлов.
Ошибка уже решена с помощью bootstrap
Это официальная документация, подтверждающая приведенные выше ответы.
Изменение расположения шрифта значка Bootstrap предполагает, что файлы шрифтов значков будут расположены в каталоге../fonts/по сравнению с скомпилированными файлами CSS. Перемещение или переименование этих файлов шрифтов означает обновление CSS одним из трех способов: Измените переменные @icon-font-path и/или @icon-font-name в источнике Меньше файлов. Используйте параметр относительных URL-адресов, предоставляемый компилятором Less. Измените пути url() в скомпилированном CSS. Используйте любой вариант, наиболее подходящий для вашей конкретной настройки разработки.
Помимо этой ошибки, которую будут делать новые пользователи, после загрузки загрузочного ZIP файла с официального сайта. Они, как правило, пропускают папку шрифтов для копирования в своей настройке dev. Так что папка с отсутствующими шрифтами также может привести к этой проблеме