Font Awesome 4.0.3 提供了369个网页常用的矢量字体图标,新浪、人人 的矢量图标也到其中哟
要求
必备知识
本文要求基本了解html与css前端代码。
运行环境
普通浏览器,兼容IE7
源码下载
Font Awesome 为您提供了一套可缩放的字体矢量图标,可以快速自定义图标的大小,颜色,阴影,这些都可以通过CSS来实现,无需任何的JS代码哦。
一,主要特点如下:
1,一个字体,369个图标
2,无需要使用JavaScript
3,通过CSS自定义图标的大小,颜色,阴影
4,用户界面友好
5,支持 Internet Explorer 7 浏览器
6,能够在 Retina 屏幕完美呈现
7,和其它图标字体不同,兼容屏幕阅读器
8,可扩展性强
9,文档完善
10,免费
二,图标类型下面简单罗列一下吧,这里只列出了部分,完整图标列表请查看这里:
1,Web应用程序常用图标:
2,表单控件图标
3,货币图标
4,文本编辑器的图标
5,网页定向图标
6,播放器图标
7,品牌图标
三,使用方法
方式一:
此方法使用最为简单,BootstrapCDN 方式
在自己网页的head标签中引入如下代码即可,不需要下载和安装任何东西即可使用:
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">
方式二:
此方式需要下载 Font Awesome项目文件夹
将Font Awesome 目录 拷贝到你的项目中,然后在head标签中引入如下代码:
<link rel="stylesheet" href=" your project(你的项目路径)/font-awesome/css/font-awesome.min.css">
具体如何在网页中添加这些矢量图标请查看如下地址:
http://fortawesome.github.io/Font-Awesome/examples/
完整图标列表请查看这里
如以上文章或链接对你有帮助的话,别忘了在文章结尾处轻轻点击一下 “还不错”按钮或到页面右下角点击 “赞一个” 按钮哦。你也可以点击页面右边“分享”悬浮按钮哦,让更多的人阅读这篇文章。
Font Awesome 4.0.3 提供了369个网页常用的矢量字体图标,新浪、人人 的矢量图标也到其中哟的更多相关文章
- Font Awesome 4.0.3 提供了369个网页常用的矢量字体图标
Font Awesome 为您提供了一套可缩放的字体矢量图标,可以快速自定义图标的大小,颜色,阴影,这些都可以通过CSS来实现,无需任何的JS代码哦. 一,主要特点如下: 1,一个字体,369个图标 ...
- php在5.5.0默认提供了Zend OPcache
eaccelerator无法兼容php5.5.0,好在php在5.5.0默认提供了Zend OPcache,所以一直习惯eaccelerator的朋友如果要升级到php5.5.0的话,可能要暂时和ea ...
- Font Awesome 4.0.3 字体图标完美兼容IE7
1.下载Font Awesome 4.0.3兼容包,http://www.thinkcmf.com/index.php?m=font 2.解压,并放到自己网站系统合适的位置(如果你的站已使用Font ...
- MiinCMP1.0 SAE 新浪云版公布, 开源企业站点系统
MiinCMP是一款开源企业站点系统,除可执行于256M左右100元的国内IDC外,JUULUU聚龙软件团队最近开发了面向新浪云的版本号,该版本号可将站点免费布署到新浪云SAE上.MiinCMP採用j ...
- 各大巨头电商提供的IP库API接口-新浪、搜狐、阿里
新浪的IP地址查询接口:http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js (不可用)新浪多地域测试方法:http://i ...
- CSS3 Maker提供了10个最为常用的CSS3属性在线生成工具
CSS3 Maker提供了10个最为常用的CSS3属性在线生成工具,比如说border-radius.gradient.transfrom.animation.transition.rgba.text ...
- RabbitMQ调试与测试工具-v1.0.1 -提供下载测试与使用
最近几天在看RabbitMQ,所以发了两天时间写了一个调试和测试工具.方便使用. 下载地址:RabbitMQTool-V1.0.1.zip
- 计算程序运行时间(.net1.1 于.net2.0的区别)在.net2.0中提供了Stopwatch类,简单例子
1. [代码].NET 2.0 using System.Diagnostics; private Stopwatch stw = new Stopwatch(); private void ...
- 如何应用Font Awesome矢量字体图标
Font Awesome 是一套专门为 Twitter Boostrap 设计的图标字体库.这套图标字体集几乎囊括了网页中可能用到的所有图标,除了包括 Twitter Boostrap 的默认图标外, ...
随机推荐
- HtmlControls和Webcontrols命名空间的区别
HtmlControls(以下简称HC)是对大部分Html标签的复制,这些标签原来是什么样,经过服务器解释后的HC就是什么样.要使用HC,只需要在相应的html标签内加上runat=“server”属 ...
- poj 3321 单点更新 区间求和
Apple Tree Time Limit: 2000 MS Memory Limit: 65536 KB 64-bit integer IO format: %I64d , %I64u Java c ...
- AlexNet详解3
Reference. Krizhevsky A, Sutskever I, Hinton G E. ImageNet Classification with Deep Convolutional Ne ...
- OpencvSharp 在WPF的Image控件中显示图像
1.安装OpencvSharp 我使用的是VS2013 社区版,安装OpencvSharp3.0 在线安装方法:进入Tools,打开NuGet的包管理器 搜索Opencv 安装之后就可以使用,无需再做 ...
- [C#]Dapper学习笔记
1.安装,直接用nuget搜索Dapper就行,不过只支持框架4.5.1 2.数据库测试表 CREATE TABLE [dbo].[Student]( [ID] [bigint] NULL, ) NU ...
- C# 在WPF中使用Exceptionless异常日志框架
登录http://exceptionless.com/官网,注册一个账户. 创建项目 选择wpf项目类型 拷贝下箭头指的这个密钥,过后程序里用的到. 下面我们打开vs,新建一个wpf的项目 打开git ...
- Android开发教程 - 使用Data Binding Android Studio不能正常生成相关类/方法的解决办法
本系列目录 使用Data Binding(一)介绍 使用Data Binding(二)集成与配置 使用Data Binding(三)在Activity中的使用 使用Data Binding(四)在Fr ...
- Android动画Animation简单示例
Animation是Android给我们提供的一个可以实现动画效果的API,利用Animation我们可以实现一系列的动画效果,比如缩放动画,透明度动画,旋转动画,位移动画,布局动画,帧动画等等.An ...
- Spring Cloud断路器Hystrix
在微服务架构中,存在着那么多的服务单元,若一个单元出现故障,就会因依赖关系形成故障蔓延,最终导致整个系统的瘫痪,这样的架构相较传统架构就更加的不稳定.为了解决这样的问题,因此产生了断路器模式. 什么是 ...
- 【wireshark】插件开发(五):C插件
1. Wireshark对C插件的支持 每个解析器解码自己的协议部分, 然后把封装协议的解码传递给后续协议. 因此它可能总是从一个Frame解析器开始, Frame解析器解析捕获文件自己的数据包细节( ...