文档章节

font-awesome 图标无法显示

柴高八斗之父
 柴高八斗之父
发布于 2016/11/30 19:12
字数 227
阅读 29
收藏 1

font-awesome 图标无法显示,如果你的相对位置没问题,那么可能是 :你项目里的样式的字体定义的问题。

因为 font-awesome本身就是字体图标,你可以打开它的css文件就可以看出:

@font-face{ font-family:'FontAwesome'

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>demo</title>
<!--<link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">-->
<style>
* {	margin:0; padding:0; font-family: "Microsoft YaHei" !important;  /*注意看这里,因为这里的全局样式字体样式定义为了微软雅黑,所以导致下面的awesome字体无法显示。*/}
</style>
<link href="css/font-awesome.min.css" rel="stylesheet" type="text/css" />
</head>

<body>
<i class="fa fa-camera-retro" style="font-size:40px; color:#F33;">2222</i>
</body>
</html>

全局定义没有问题,【解决办法:只要去掉后面的 !important 即可。】

 

© 著作权归作者所有

共有 人打赏支持
柴高八斗之父
粉丝 5
博文 200
码字总数 111898
作品 0
宁波
前端工程师
私信 提问
关于字体图标在firefox上本地访问无法显示的问题分析

一、问题 在本地引入了Font Awesome 字体图标,网页未部署到服务上(在本地直接访问,部署到nginx服务器,火狐浏览器能显示) 目录结构: 引入方式: 使用方式: 访问地址: 在Chrome浏览器中...

二两豆腐
2016/11/07
1K
1
如何将 Font Awesome 转成 PNG 图标

Font Awesome为Twitter Bootstrap提供了一种独一无二的图像字体.它还提供了CSS的很强的扩展性. CSS 提供了一种描述HTML的机制,可以让你自由的设计网页。 你能给Font Awesome加上各种各样的参...

oschina
2014/03/26
14.4K
16
font-awesome与easyui结合

备忘记录 最近想重拾起来,做个ERP系统,做为一个前端盲,前端框架的选择是最头痛的问题 当前bootstrap与font-awesome的组合无疑是非常有吸引力的,从网上下了N多的后台框架模板,断断续续调...

itwarcraft
2014/10/25
0
0
Font Awesome 3.1 发布,Bootstrap 图标字体

Font Awesome 3.1 发布了,该版本包含 54 个新图标,更多样式,详情请看 CHANGELOG。 Font Awesome 是为 Twitter Bootstrap 设计的图标字体。通过Web Font的方式来显示一些图标,好处是图标可...

oschina
2013/05/12
5K
2
font awesome 在火狐浏览器下无法显示

在本地引入了Font Awesome 字体图标,网页未部署到服务上(在本地直接访问,部署到nginx服务商,火狐浏览器又能显示了),引入方式如下 使用方式如下 在Google浏览器,IE浏览器上显示正常,但...

二两豆腐
2016/11/06
438
1

没有更多内容

加载失败,请刷新页面

加载更多

Windows 上安装 Scala

在安装 Scala 之前需要先安装 Java 环境,具体安装的详细方法就不在这里描述了。 您可以自行搜索我们网站中的内容获得其他网站的帮助来获得如何安装 Java 环境的方法。 接下来,我们可以从 ...

honeymose
今天
1
0
数据库篇多表操作

第1章 多表操作 实际开发中,一个项目通常需要很多张表才能完成。例如:一个商城项目就需要分类表(category)、商品表(products)、订单表(orders)等多张表。且这些表的数据之间存在一定的关系...

stars永恒
今天
3
0
nginx日志自动切割

1.日志配置(Nginx 日志) access.log----记录哪些用户,哪些页面以及用户浏览器,IP等访问信息;error.log------记录服务器错误的日志 #配置日志存储路径:location / {      a...

em_aaron
昨天
5
0
java 反射

基本概念 RTTI,即Run-Time Type Identification,运行时类型识别。RTTI能在运行时就能够自动识别每个编译时已知的类型。   要想理解反射的原理,首先要了解什么是类型信息。Java让我们在运...

细节探索者
昨天
2
0
推荐转载连接

https://www.cnblogs.com/ysocean/p/7409779.html#_label0

小橙子的曼曼
昨天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部