我正在尝试从 Bootstrap2 升级到 Bootstrap3。到目前为止一切正常,除了 Glyphicons:显示一个正方形而不是图标:
我正在使用 Symfony2。这就是我调用 Bootstrap CSS 的方式:
<link rel="stylesheet" href="{{ asset('css/bootstrap.css') }}" type="text/css" />
这就是我对字形图标的称呼:
<span class="glyphicon glyphicon-search"></span>
我的文件结构如下:
- /网络
- /CSS
- bootstrap.css
- /字体
- 4 个字形文件
- /CSS
这似乎是一个常见问题(例如,参见 this topic 、 this topic 或 this topic),但那里找到的解决方案都没有解决我的问题。
我是从 bootstrap 网站下载文件的,而不是从定制器下载的。 此外,我使用以下文件结构进行了测试(在一个完全不同的文件夹中,但具有相同的 Bootstrap 文件),在这些主题之一上找到:
- /测试
- /CSS
- bootstrap.css
- /字体
- 4 个字形文件
- index.html
- /CSS
Index.html 蜂鸣:
<!DOCTYPE html>
<html>
<head>
<meta chaset="utf-8">
<title>Test icons</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
</head>
<body>
<button type="button" class="btn btn-default btn-lg">
<span class="glyphicon glyphicon-star"></span> Star
</button>
</body>
</html>
而且这个测试完美运行,所以字形文件没有损坏。
我的真实站点的字符集也是UTF-8。
我检查了 bootstrap.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.woff') format('woff'),
url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'),
url('../fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');
}
.glyphicon {
position: relative;
top: 1px;
display: inline-block;
font-family: 'Glyphicons Halflings';
-webkit-font-smoothing: antialiased;
font-style: normal;
font-weight: normal;
line-height: 1;
-moz-osx-font-smoothing: grayscale;
}
所以我猜我调用 CSS 的方式“修改”了它的路径,因此与字形路径不同,即找不到图标。
我应该如何调用CSS或修改src: url('?????????/glyphicons-halflings-regular.eot');有正确的链接?
最佳答案
检查您在 security.yml
中排除的/fonts 路径
security:
firewalls:
assets:
pattern: ^/(_(profiler|wdt)|css|images|js|fonts)/
security: false
如果您直接访问 font(yourhost.com/fonts/glyphicons-halflings-regular.woff) 会怎样?还要检查 firebug 或 chrome inspector 网络选项卡中的错误。
关于css - Twitter Bootstrap 3 Glyphicons 错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21156627/