Font Awesome(一套很棒的图标库)
Font Awesome 是一个非常方便的图标库。这些图标都是矢量图形,被保存在 .svg 的文件格式中。这些图标就和字体一样,你可以通过像素单位指定它们的大小,它们将会继承其父HTML元素的字体大小。
你可以将 Font Awesome 图标库增添至任何一个应用中,方法很简单,只需要在你的 HTML 头部增加下列代码即可:
<link rel="stylesheet" href="//cdn.bootcss.com/font-awesome/4.2.0/css/font-awesome.min.css"/>
当然也可以下载到本地使用,地址:http://fontawesome.io/ http://fontawesome.dashgame.com/ (中文网)
(link的路径根据自己下载保存的位置来定);
使用方式:
i 元素起初一般是让其它元素有斜体(italic)的功能,不过现在一般用来指代图标。你可以将 Font Awesome 中的 class 属性添加到 i 元素中,把它变成一个图标,比如:
<i class="fa fa-info-circle"></i>
使用案例:
官网给出了详细的使用案例哦(可以自己动手试试,真理来源于实践):http://fontawesome.io/examples/
Font Awesome(一套很棒的图标库)的更多相关文章
- Font Awesome,一套绝佳的图标字体库和CSS框架
http://fontawesome.dashgame.com/ http://www.runoob.com/font-awesome/fontawesome-tutorial.html Font A ...
- Font Awesome图标库
Font Awesome 是一个非常方便的图标库.这些图标都是矢量图形,被保存在 .svg 的文件格式中.这些图标就和字体一样,你可以通过像素单位指定它们的大小,它们将会继承其父HTML元素的字体大小 ...
- vue中引入.svg图标,使用iconfont图标库
阿里巴巴的iconfont是一个很好的图标库,海量的素材可以快速满足开发人员日常对图标的诉求,我们采用symbol引用,官方介绍 创建SvgIcon组件 <template> <sv ...
- 在nuxt中引入Font Awesome字体图标库
介绍 在element-ui框架中提供了一些图标样式,但是种类比较少,所以在这里提供一套更完善的字体图标库Font Awesome(官方文档),下面就开始介绍如何在一个nuxt项目中使用这套字体库. ...
- EasyDropDown – 很棒的下拉菜单,含精美主题
EasyDropDown 是一个 jQuery 插件,你可以毫不费力地将简陋的 Select 元素设置为可定制风格的下拉菜单,用于表单或者一般的导航.和著名的下拉插件 Chosen 很像,但是具有自己 ...
- 推荐几款很棒的 JavaScript 表单美化和验证插件
表单元素让人爱恨交加.作为网页最重要的组成部分,表单几乎无处不在,从简单的邮件订阅.登陆注册到复杂的需要多页填写的信息提交功能,表单都让开发者花费了大量的时间和精力去处理,以期实现好用又漂亮的表单功能 ...
- 30 个很棒的 PHP 开源 CMS 内容管理系统
本文汇集了30个优秀的开源CMS建站系统,采用PHP开发.以下列表不分先后顺序. 1. AdaptCMS AdaptCMS Lite 是一个开源的CMS系统,主要特点是易用,而且可以轻松和其他系统接驳 ...
- 阿里UX矢量图标库–最强大的矢量图标库(Icon font制作力荐工具)
继前面介绍过ICON-FONT的制作后,找了几个ICON库都是国外的今天偶然发现阿里巴巴的图标矢量库,www.iconfont.cn用了之后感觉很强大,丰富的图标库(集合阿里妈妈&淘宝的图标库 ...
- 优秀工具推荐:两款很棒的 HTML5 游戏开发工具
HTML5 众多强大特性让我们不需要多么高深技术就能创建好玩的网页游戏,同时证明了开放的 Web 技术能与任何其他在游戏开发中使用的技术竞争.正如标题所说,这篇文章推荐的几款很棒 HTML5 游戏开发 ...
随机推荐
- 论EFMS模拟量部分采集电路的修改
论1:电阻R11的作用 如图1是2014-3-11之前模拟量采集的部分硬件电路,图2是纠正后的正确电路. D5是SA20CA,TVS双向二极管,有效防止外接电源的浪涌冲击情况,保护电路. D6是稳压 ...
- 调用 TBrowseForFolder 的正确姿势
[教程]调用 TBrowseForFolder 的正确姿势 2017-08-22 • C++ Builder.Delphi.教程 • 暂无评论 • swish •浏览 562 次 TBrowseFor ...
- Android-Java-面向对象的代码例子
需求一:用手机打电话,发短信,看视频,听音乐,用面向对象思想实现: package android.java.oop01; /** * 1.既然是面向/面对 --> 对象 就要把 (用手机打电话 ...
- python36--将数据保存为excel
#!/usr/bin/env python # -*- coding: utf-8 -*- import xlwt import os class ExcelHelper(object): @stat ...
- Python--随机生成指定长度的密码
在浏览别人博客时学习了random模块,手痒自我练习下,写个随机生成指定长度的密码字符串的函数,拿出来供各位参考: 废话不多说,上代码: # coding: utf-8 import random i ...
- .net图表之ECharts随笔03-热力地图
基于01和02 要得到如图所示的热力地图(我从NuGet上下载的包没有heatmap.js文件,没法直接搞热力图,只好暂时先搞着地图.后面尽量搞一下),一般要设置四个参数——title.tooltip ...
- VS2017+EF+Mysql生成实体数据模型(解决闪退的坑) 版本对应才行
最近要使用VS2017+EF+Mysql,在生成实体数据模型踏过一些坑,在此做个总结. 1.先下载并安装 mysql-connector-net-6.9.10.msi 和 mysql-for-vi ...
- ArrayBlockingQueue源码解析(2)
此文已由作者赵计刚授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 3.3.public void put(E e) throws InterruptedException 原 ...
- Swift5 语言参考(八) 模式
模式表示单个值或复合值的结构.例如,元组的结构是两个元素的逗号分隔列表.因为模式表示值的结构而不是任何一个特定值,所以可以将它们与各种值匹配.例如,模式匹配元组和任何其他两元素元组.除了将模式与值匹配 ...
- activemq在一台服务器上启动多个Broker
步骤如下: 1.把整个conf文件夹复制一份,比如叫conf2 2.修改里面的activemq.xml文件 ①brokerName不能和原来的重复 ②数据存放的文件名称不能重复,比如<kahaD ...