Bootstrap 3 Glyphicons are not working
Bootstrap 3 Glyphicons are not working
解答1
Note to readers: be sure to read @user2261073's comment and @Jeff's answer concerning a bug in the customizer. It's likely the cause of your problem.
The font file isn't being loaded correctly. Check if the files are in their expected location.
@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.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');
}
As indicated by Daniel, it might also be a mimetype issue. Chrome's dev tools show downloaded fonts in the network tab:
解答2
-If you followed the highest rated answer and it's still not working:
The Font
folder MUST be on the same level as your CSS folder. Fixing the path in bootstrap.css
will not work.
Bootstrap.css
has to navigate to the Fonts
folder exactly like this:
@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.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}