簡體   English   中英

Bootstrap 3.3.4 Glyphicons無法正常工作?

[英]Bootstrap 3.3.4 Glyphicons not working?

最近我一直在努力使Glyphicons正常運行,但是沒有運氣。 我正在使用具有以下文件結構的JSF框架。

在此處輸入圖片說明

我還通過從以下CSS代碼中的每個路徑中刪除(..)來修改bootstrap.css中的CSS,使其變為:

@font-face {
  font-family: 'Glyphicons Halflings';

  src: url('/fonts/glyphicons-halflings-regular.eot');
  src: url('/fonts/glyphicons-halflings-regular.eot?#iefix')    format('embedded-opentype'), url('/fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('/fonts/glyphicons-halflings-regular.woff') format('woff'), url('/fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
   }  

如果不刪除(..),JSF將顯示以下2條警告:

Warning:   JSF1091: No mime type could be found for file css/lib/fonts/glyphicons-halflings-regular.woff2.  To resolve this, add a mime-type mapping to the applications web.xml.
Warning:   JSF1064: Unable to find or serve resource, css/lib/fonts/glyphicons-halflings-regular.woff2.  

但是仍然總是向我顯示一個奇怪的盒子,而不是應該顯示的Glyphicon嗎?

請幫助..

我通過使用以下表達式正確引用資源找到了解決方案:

@font-face {

  font-family: 'Glyphicons Halflings';

  src: url("#{resource['default/1_0/fonts/glyphicons-halflings-regular.eot']}");
  src: url("#{resource['default/1_0/fonts/glyphicons-halflings-regular.eot']}") format('embedded-opentype'), url("#{resource['default/1_0/fonts/glyphicons-halflings-regular.woff2']}") format('woff2'), url("#{resource['default/1_0/fonts/glyphicons-halflings-regular.woff']}") format('woff'), url("#{resource['default/1_0/fonts/glyphicons-halflings-regular.ttf']}") format('truetype'), url("#{resource['default/1_0/fonts/glyphicons-halflings-regular.svg']}") format('svg');

     }

問題出在字體文件夾。

將您的字體文件夾替換為位於以下位置的一個: https : //github.com/twbs/bootstrap ,它將正常工作。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM