字体图标学习

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

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

主要特色

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

使用方法

  使用 CSS:

  1. 拷贝 Font Awesome 字体目录到项目中;
  2. 拷贝 font-awesome.min.css 文件到项目中;
  3. 修改 font-awesome.min.css 文件中的字体路径到正确的位置;
  4. 在页面的 head 里引入 font-awesome.min.css 文件:
<link rel="stylesheet" href="../css/bootstrap.min.css">
<link rel="stylesheet" href="../css/font-awesome.min.css">

  使用 LESS:

  1. 拷贝 Font Awesome 字体目录到你的项目中;
  2. 拷贝 font-awesome.less 文件到 bootstrap/less 目录。
  3. 打开 bootstrap.less 文件并替换 @import "sprites.less"; 为 @import "font-awesome.less";
  4. 编辑 elusive-webfont.less 文件的 @FontAwesomePath 变量为字体路径:
@FontAwesomePath:   "../font";

  然后重新进行 LESS 编译就可以了。

 

目录
相关文章
|
13天前
|
安全 网络协议 算法
Nmap网络扫描工具详细使用教程
Nmap 是一款强大的网络发现与安全审计工具,具备主机发现、端口扫描、服务识别、操作系统检测及脚本扩展等功能。它支持多种扫描技术,如 SYN 扫描、ARP 扫描和全端口扫描,并可通过内置脚本(NSE)进行漏洞检测与服务深度枚举。Nmap 还提供防火墙规避与流量伪装能力,适用于网络管理、渗透测试和安全研究。
162 1
|
8天前
|
监控 供应链 前端开发
如何开发ERP(离散制造-MTO)系统中的财务管理板块(附架构图+流程图+代码参考)
本文详解离散制造MTO企业ERP系统中财务管理模块的搭建,聚焦应收账款与应付账款管理,涵盖核心功能、业务流程、开发技巧及Python代码示例,助力企业实现财务数据准确、实时可控,提升现金流管理能力。
|
人工智能 安全
大模型安全撬壳计划(一) 手把手教你参加大模型安全撬壳计划
“大模型安全撬壳计划”由阿里巴巴集团安全部主办,旨在通过真实环境攻防实战,探索大模型安全边界,培养顶尖AI安全人才。大赛提供场景、技术、数据与奖金支持,赛程包括报名(7月9日-8月14日)、初赛与复赛。参赛者可通过大赛官网报名并提交攻击方法代码,挑战模型安全极限。更多信息请访问大赛网址。
264 0
QGS
|
Java 容器
浅学JAVAFX布局
浅学JAVAFX布局
QGS
201 0
|
NoSQL 数据处理 MongoDB
MongoDB查询操作深度剖析
【4月更文挑战第30天】本文深入探讨了MongoDB查询操作,包括查询语法、优化及高级技巧。使用`find()`方法进行查询,如`db.users.find({ age: { $gt: 25 } })`找年龄大于25的用户。优化查询性能涉及创建索引、使用复合索引和避免全表扫描。高级查询涵盖聚合管道、文本搜索和地理空间查询,提供复杂数据处理和地理位置查询能力。理解并应用这些知识能提升MongoDB的使用效率和应用性能。
|
存储 自然语言处理 关系型数据库
|
存储 Kubernetes jenkins
k8s-部署jenkins
jenkins部署 jenkins和k8s集成 jenkins基于k8s,执行pipline
k8s-部署jenkins
|
存储 消息中间件 Kubernetes
10分钟在 Rainbond 上部署 mall 电商项目
本文介绍在 Rainbond 上的两种部署 mall 电商项目的方式: 1. 通过 Rainbond 开源应用商店快速部署 mall 2. 从 0 开始部署 mall 项目所有服务
|
数据可视化 图形学 UED
3dsMax2023正式版补丁包序列号高效的三维制作软件
3D Max 2023已经正式发布了,由Autodesk公司开发的一款专业高效的三维制作软件,集三维建模、动画和渲染三大功能于一体,目前广泛应用于工业设计、建筑设计、三维动画、广告、影视、多媒体制作、游戏、辅助教学以及工程可视化等领域。我还是比较习惯用2023的版本。
815 0