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

直接在 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. you’re in reality a excellent webmaster. The webb site loading pace is amazing.
    It seems that you are doing any unique trick. Moreover, The
    conternts are masterwork. you’ve performed a wonderful activity on this matter!

    2018年8月17日 10:33 评论
  2. 79楼
    来自天朝的朋友 火狐浏览器5.0 Windows 7
    cheap jordans  

    My wife and i have been now thrilled that Emmanuel could deal with his studies because of the precious recommendations he discovered out of your web site. It’s not at all simplistic to simply continually be freely giving techniques which many people might have been selling. And now we figure out we’ve got the blog owner to be grateful to for that. These illustrations you have made, the simple website menu, the friendships you make it easier to create – it’s got most extraordinary, and it is facilitating our son and our family reckon that this subject matter is cool, which is tremendously indispensable. Thanks for the whole lot!

    2018年8月17日 09:25 评论
  3. 78楼
    Sweden 谷歌浏览器 Windows 7
    Taylah  

    I think this is among the most important information for me.
    And i am glad reading your article. But should remark on few general things, The web site style is great,
    the articles is really great : D. Good job, cheers

    2018年8月16日 10:18 评论
  4. 77楼
    这家伙可能用了美佬的代理 谷歌浏览器 Windows 7
    corroded  

    It’s appropriate time to make some plans for the future and it is
    time to be happy. I have read this post and if I could I wish to suggest you few interesting things or tips.
    Perhaps you can write next articles referring to this article.
    I wish to read even more things about it!

    2018年8月13日 18:40 评论
  5. At this tme it appears like Expression Engine is the preferred blogging platform available right now.
    (from what I’ve read) Is that what you’re using on your blog?

    2018年8月10日 14:22 评论
  6. 75楼
    这家伙可能用了美佬的代理 火狐浏览器 Windows 7
    onesie animal  

    If you desire to increase your know-how only keep visiting this site and be updated with the
    most up-to-date gossip posted here.

    2018年8月10日 14:20 评论
  7. Unquestionably imagine that which you stated. Your favorite reason seemed to be on the internet the
    easiest thing to have in mind of. I say to you, I certainly get irked whilst people consider worries that they
    plainly do not understand about. You managed to hit the nail upon the highest and outlined out the whole thing with no need side effect , folks could
    take a signal. Will likely be back to get more. Thank you

    2018年8月10日 10:48 评论
  8. I am really impressed with your writing skills and also with the layout
    on your blog. Is this a paid theme or did you modify it yourself?
    Anyway keep up the nice quality writing, it’s rare to see a nice blog like this one nowadays.

    2018年8月9日 07:20 评论
  9. I enjoy, lead to I found just what I used to be looking
    for. You’ve ended my 4 day long hunt! God
    Bless you man. Have a great day. Bye

    2018年8月9日 05:47 评论
  10. 71楼
    这家伙可能用了美佬的代理 谷歌浏览器 Windows 7
    uncommon  

    Remarkable! Its actually awesome post, I have got much clear idea about from this piece of writing.

    2018年8月8日 14:46 评论

发表评论

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

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