当前位置:首页 > 代码·功能杂七杂八 > 正文

直接在 CSS 中引用 FONTAWESOME 图标

fontawesome

前段时间小幻想在站点内引用一下FONTAWESOME 的图标,不过看样子好像是要加载一下官方的CSS才可以,于是只好下载了官方CSS,不过看了下,原来那货就是在CSS中加载了一个字体,再给那些矢量字体(即FONTAWESOME 图标)编码赋予值,那么,我就呵呵呵了…

首先CSS中加载一下字体文件,然后,下面的就可以搞定了(当然,哪天微软默认带着FONTAWESOME 字体那就不需要了)

所以,小幻果断不用 Fontawesome 提供的类,只想在 css 里面引用图标,可以这样子,其余请自行脑补:

.icon:before {
    content: '\f007';
    font-family: FontAwesome;
}

编码就附上和官方CSS想对应的值,下表 (点击下一页)

关于加载FONTAWESOME字体

	@font-face {
	font-family:'FontAwesome';
	src:url(http://static.ihuan.me/wp-content/themes/CKoo/fonts/fontawesome-webfont.eot?v=4.1.0);
	src:url(http://static.ihuan.me/wp-content/themes/CKoo/fonts/fontawesome-webfont.eot?#iefix&v=4.1.0) format('embedded-opentype'),url(http://static.ihuan.me/wp-content/themes/CKoo/fonts/fontawesome-webfont.woff?v=4.1.0) format('woff'),url(http://static.ihuan.me/wp-content/themes/CKoo/fonts/fontawesome-webfont.ttf?v=4.1.0) format('truetype'),url(http://static.ihuan.me/wp-content/themes/CKoo/fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular)format('svg');
	font-weight:normal;
	font-style:normal
}

字体源是小幻的,可以自己通过下载,保存!

废话:最后说一下那个引用图标的那个东东吧   http://ihuan.me/shuo 碎言碎语~~~

分页阅读: 1 2 下一页
标签:
上一篇: 下一篇:

96 条评论

评论加载中...
  1. I am really impressed with your writing skills and alwo with
    the layout on your blog. Is this a paid theme or did you modify it yourself?
    Either way kewep up thhe nice quality writing, it’s rare to see
    a nice blog like this one nowadays.

    2018年8月20日 03:41 评论
  2. Incredible points. Outstanding arguments.

    Keep up the good spirit.

    2018年8月20日 03:19 评论
  3. 高能聚焦量超聲波( HIFU )以物理性聚焦集中成一點, 快速穿透皮膚真皮及脂肪層面直達面部表淺肌肉腱膜系統( SMAS )層令其組織細胞分子高速磨擦 , 瞬間升溫至60 -70 度,令整個表淺肌肉腱膜系統( SMAS )受熱收縮,形成熱固化區域, 令結綈組織同時拉緊,達到拉皮防皺及美容效果。SMAZ聚焦超聲波提供了最有效的HIFU能量收緊皮膚及刺激胶原蛋白新生,提升彈性,恢復更緊緻的皮膚和更年輕的美貌。

    2018年8月20日 02:59 评论

发表评论

不理你。不要啊!吃饭。吃惊。吃西瓜。飞吻!恭喜!Hi纠结!膜拜!OK抛媚眼。泡泡糖。抛钱。忍!生闷气!调皮。偷看。委屈。献花。疑问?抓狂!

小提示:Ctrl+Enter快速提交助您一臂之力~
加载中……