HTML中缩放的矢量图标,您可以使用CSS所提供的所有特性对它们进行更改,包括:大小、颜色、阴影或者其它任何支持的效果。

Font Awesome 传送门:http://fontawesome.dashgame.com/

部分图标:

其他效果图:

调用实例:

 <html>
<head>
<title>Font Awesome图标调用实例</title> <!-- 将下载的Font Awesome图标文件夹放入项目css,并增加下段代码 -->
<link href="css/font-awesome-4.4.0/css/font-awesome.min.css" rel="stylesheet" type="text/css"> </head> <body> <label>Name</label> <br>
<br> <!-- 简单的调用方式 -->
<i class="fa fa-user"></i>
<input type="text" value=""> </body>
</html>

Font Awesome百度云链接:

http://pan.baidu.com/s/1gdMEDTx

密码: wrac

效果如下:

其他调用方式 Font Awesome 。

CSS 中Font Awesome 图标(附码表)的更多相关文章

  1. 直接在 CSS 中引用 FONTAWESOME 图标(附码表)

    直接在 CSS 中引用 FONTAWESOME 图标(附码表) 因此我们如果不想用 Fontawesome 提供的类,只想在 css 里面引用图标的话,可以这样子,请自行脑补: .icon:befor ...

  2. css中 font常用的样式属性

    今天我总结一下文本常用的字体样式 1.font常用样式 1)字体类型 语法:font-family: +字体类型:    如: font-family:宋体; 2)字体大小 语法:font-size: ...

  3. css 中font属性知识点总结

    一. font属性值可以继承.例如子元素可以继承父元素的行高,字体大小等等. 二.font属性可以进行连写:font: font-sytle  font-weight  font-size/line- ...

  4. CSS中(font和background)的简写形式

    转自:http://blog.csdn.net/shenzhennba/article/details/7356095 1.字体属性主要包括下面几个:font-family(字体族): “Arial” ...

  5. 在WPF应用程序中使用Font Awesome图标

    Font Awesome 在网站开发中,经常用到.今天介绍如何在WPF应用程序中使用Font Awesome . 如果是自定义的图标字体,使用方法相同. 下载图标字体 在官方网站或github上下载资 ...

  6. 在Qt中使用Font Awesome图标

    官网: http://fontawesome.io/中文网: http://www.fontawesome.com.cn/GitHub: https://github.com/FortAwesome/ ...

  7. Font Awesome:图标字体,完全CSS控制

    Font Awesome是一种web font,它包含了几乎所有常用的图标,比如Twitter.facebook等等.用户可以自定义这些图标字体,包括大小.颜色.阴影效果以及其它可以通过CSS控制的属 ...

  8. AngularCli项目中添加字体图标(Font)详解

    本文主要讲如何在AngularCli生成的项目中使用字体图标. 一 SVG图标准备 将需要转换为字体图标的图片转换为SVG格式. 这个让项目视觉设计师搞定即可. 二 SVG图标转Font 可以通过Ic ...

  9. 认识CSS中标题引入icon图标

    前端之HTML,CSS(十一) icon图标 icon图标的使用 获取网站的中标题icon图标,以京东为例:在域名后添加/favicon.ico Enter打开 鼠标右键,图标另存为下载icon图标, ...

随机推荐

  1. CATransition的type属性类型

    用字符串表示 pageCurl            向上翻一页      pageUnCurl          向下翻一页      rippleEffect        滴水效果      s ...

  2. form表单的属性标签和练习

    form表单的标签 做一个如下图的form表单: 我们的代码如下: <body leftmargin="400px" topmargin="200px"& ...

  3. QR 二维码总结

    @(Java ThirdParty)[QR] QR 二维码总结 根据Wiki中的介绍,QR Code(Quick Response Code),二维条形码,由日志设计应用于汽车制造工业中.条形码中包含 ...

  4. 移动端Web开发调试之Chrome远程调试(Remote Debugging)

    比如手机钉钉调试页面,下面是一位同学整理的链接: http://blog.csdn.net/freshlover/article/details/42528643/ 如果inspect 后,一直空白, ...

  5. maven 多模块项目

    转自:http://www.blogjava.net/fancydeepin/archive/2015/06/27/maven-modules.html 项目结构 proj   |   |— proj ...

  6. 利用exp/imp备份恢复数据库实例

    用exp/imp备份数据库: Oracle数据导入导出imp/exp功能:Oracle数据导入导出imp/exp就相当与oracle数据还原与备份. 大多情况都可以用Oracle数据导入导出完成数据的 ...

  7. nuget国内镜像的解决办法

    不求人,在阿里云上安一个nuget镜像站,这样就能愉快编程了. 主要是利用nginx 的反向代理+缓存功能+响应文本的替换 proxy_cache_path /data/nuget-cache lev ...

  8. 【codeforces 415D】Mashmokh and ACM(普通dp)

    [codeforces 415D]Mashmokh and ACM 题意:美丽数列定义:对于数列中的每一个i都满足:arr[i+1]%arr[i]==0 输入n,k(1<=n,k<=200 ...

  9. Linux收藏

    Unix目录结构的来历   vi 操作笔记  Linux下安装和配置JDK与Tomcat(升级版) Windows下 刷新本地DNS缓存:ipconfig /flushdns 深圳DNS: 202.9 ...

  10. 【Android自学日记】【转】Android Fragment 真正的完全解析(上)

    自从Fragment出现,曾经有段时间,感觉大家谈什么都能跟Fragment谈上关系,做什么都要问下Fragment能实现不~~~哈哈,是不是有点过~~~ 本篇博客力求为大家说明Fragment如何产 ...