zoukankan      html  css  js  c++  java
  • UI图标不用愁:矢量字体图标Font-Awesome

    Font-Awesome,这个项目主要是css3的一个应用,准确的说是一段css,这里的把很多图标的东西做到了font文件里面,然后通过引用外部font文件的方式,来展现图标。

    Font Awesome 是一套专门为 Twitter Boostrap 设计的图标字体库。这套图标字体集几乎囊括了网页中可能用到的所有图标,除了包括 Twitter Boostrap 的默认图标外,还有社交网络图标、Web 应用程序图标和编辑器图标等等,可以免费用于商业项目。

    主要特色:

    ✓ 一种字体,249个图标,是网页操作的象形语言;
    ✓ 纯 CSS 控制,能够轻松定义图标的颜色、大小、阴影以及任何 CSS 能够实现的效果
    ✓ 无限缩放,矢量图标在任何尺寸下都一模一样;
    ✓ 免费使用,包括商业和非商业项目;
    ✓ 支持 Internet Explorer 7 浏览器;
    ✓ 能够在 Retina 屏幕完美呈现;
    ✓ 完全兼容 Twitter Boostrap 最新版本;
    ✓ 对设计师友好,设计师能够轻松使用;
    ✓ 和其它图标字体不同,兼容屏幕阅读器

    使用方法

      使用 CSS:
    拷贝 Font Awesome 字体目录到项目中;
    拷贝 font-awesome.min.css 文件到项目中;
    修改 font-awesome.min.css 文件中的字体路径到正确的位置;
    在页面的 head 里引入 font-awesome.min.css 文件:

    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/font-awesome.min.css">

    QQ交流:187395037

    以下是适量字体实例效果

    以上的矢量字体包和CSS实例可以从我的CSDN地址下载

    下载地址:http://download.csdn.net/detail/venus150/7141267

  • 相关阅读:
    csp-s模拟 77/78 (达哥专场)
    csp-s 模拟76
    csp-s模拟75 导弹袭击
    反思集
    模拟69/70 考试反思
    抱大腿
    csp-s模拟61 甜圈
    实时记录
    好题思路集汇
    半集训反思 8.28 「路,还是要自己走的」
  • 原文地址:https://www.cnblogs.com/keleyu/p/3643082.html
Copyright © 2011-2022 走看看