bootstrap字體圖示怎麼引用-Bootstrap教程-PHP中文網

bootstrap字體圖示怎麼引用

藏色散人

發布： 2020-11-30 15:41:52

原創

4185 人瀏覽過

bootstrap字體圖示的引用方法：先建立一個fonts資料夾；然後放在和js、css檔案同級目錄下；最後透過「src: url('font/glyphicons-halflings-regular.eot ');”方式引用字體圖示即可。

bootstrap字體圖示怎麼引用

本教學操作環境：Windows7系統、bootstrap3版，此方法適用於所有品牌電腦。

推薦：《bootstrap教學》

Bootstrap正確引用字體圖示：

##補充：

其實不需要下面這麼麻煩，只要建一個fonts資料夾放在和js,css檔案同級目錄下，就可以正確引用，關鍵是下面這幾個檔案得有：

第一種（字體檔案的路徑請靈活改變）

<style type="text/css">
        @font-face {
            font-family: 'Glyphicons Halflings';
            src: url('font/glyphicons-halflings-regular.eot');
            src: url('font/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('font/glyphicons-halflings-regular.woff') format('woff'), url('font/glyphicons-halflings-regular.ttf') format('truetype'), url('fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
        }

登入後複製

第二種

<!--<style type="text/css">
            @font-face {
    font-family: 'Glyphicons Halflings';
    src: url('font/glyphicons-halflings-regular.eot');
    src: url('font/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),
          url('font/glyphicons-halflings-regular.woff') format('woff'), 
          url('font/glyphicons-halflings-regular.ttf') format('truetype'),
          url('font/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
   }

登入後複製

注意：用font-size屬性調整字體圖示的大小，且不會失真。

更多程式相關知識，請造訪：

程式設計學習！！

以上是bootstrap字體圖示怎麼引用的詳細內容。更多資訊請關注PHP中文網其他相關文章！