How to reference fonts in bootstrap

In fact, there is no need to go to the following trouble. You only need to create a fonts folder and place it in the same directory as the js and css files, and it can be referenced correctly.

The key is that the following files must be present: (recommended learning: Bootstrap video tutorial )

glyphicons-halflings-regular.eot
glyphicons-halflings-regular.svg
glyphicons-halflings-regular.ttf
glyphicons-halflings-regular.woff

The relevant CSS rules are written on the bootstrap.css and bootstrap-min.css files in the css folder in the dist folder.

Please change the path of the font file flexibly

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

So the font-face rule actually declares the font-family and location where the glyphicons are found.

For more technical articles related to Bootstrap, please visit the Bootstrap Tutorial column to learn!

The above is the detailed content of How to reference fonts in bootstrap. For more information, please follow other related articles on the PHP Chinese website!