And*_*raD 4 twitter-bootstrap angularjs glyphicons
我正在研究Angular.js Todo应用程序视频教程,我遇到了一个问题,包括index.html文件中的Twitter Bootstrap 3 glyphicons(这些图标在Chrome和Firefox中都显示为非描述性图像).
这就是我在index.html中添加bootstrap和bootstrap-glyphicons css文件的方法:
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
<script src="http://documentcloud.github.com/underscore/underscore-min.js"></script>
<script type="text/javascript" src="todo.js"></script>
<link rel="stylesheet" href="bootstrap/css/bootstrap.css">
<link rel="stylesheet" href="bootstrap/css/bootstrap-glyphicons.css">
<link rel="stylesheet" href="todo.css">
</head>
这就是我稍后在文件中添加所需的glyphicon的方法:
<form class="form-horizontal">
<input type="text" ng-model="formTodoText" ng-model-instant>
<button class="btn"><i class="glyphicon glyphicon-plus"></i>Add</button>
</form>
bootstrap-glyphicons字体文件位于bootstrap/css/fonts中.具体来说,文件是:
有关如何正确访问图标的任何想法？非常感谢你的帮助!
我首先检查你的libs上的版本.
如果您在此拉取请求之前使用版本,则可能指向不存在的资产.引导程序3.0.0-制品分公司抽象glyphicons出此回购.
我还会在URL资产路径之前添加一个/从基本URL调用.
<link rel="stylesheet" href="/bootstrap/css/bootstrap.css">
<link rel="stylesheet" href="/bootstrap/css/bootstrap-glyphicons.css">
在官方的glyphicons登陆器上,一个例子使用<span></span>而不是<i></i>
<span class="glyphicon glyphicon-ok"></span>
他们有可能改变这种惯例.
编辑
在源中,您将看到资产的绝对路径.仔细检查您的fonts目录是否与目录处于同一级别css.
src:url('../fonts/glyphiconshalflings-regular.eot');
| 归档时间： |
|
| 查看次数： |
13307 次 |
| 最近记录： |