Font Awesome

fa是什么?

图标字体库和CSS框架

怎么用?

<link

rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css">

有哪些可用?

范例?

<!DOCTYPE html>

<html>

<head>

<title>Font Awesome 图标</title>

<meta name="viewport" content="width=device-width, initial-scale=1">

<link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css">

</head>

<body>

<h1>fa fa-address-card-o</h1>

<i class="fa fa-address-card-o"></i>

<i class="fa fa-address-card-o" style="font-size:24px"></i>

<i class="fa fa-address-card-o" style="font-size:36px"></i>

<i class="fa fa-address-card-o" style="font-size:48px;color:red"></i>

<br>

<p>按钮中使用:</p>

<button style="font-size:24px">

按钮

<i class="fa fa-address-card-o"></i>

</button>

<p>Unicode:</p>

<i style="font-size:24px" class="fa">&#xf2bc</i>

</body>

</html>

参考:

http://www.runoob.com/font-awesome/fontawesome-tutorial.html

http://www.runoob.com/font-awesome/fontawesome-reference.html

;

font awesome (图标字体库)的更多相关文章

  1. Font Awesome图标字体库（2015年05月25日）

    Font Awesome是一款非常棒的字体图标工具,给个地址,具体的自已慢慢去体会,只能帮你到这儿了...... http://fortawesome.github.io/Font-Awesome/ ...

  2. Font Awesome,一套绝佳的图标字体库和CSS框架

    http://fontawesome.dashgame.com/ http://www.runoob.com/font-awesome/fontawesome-tutorial.html Font A ...

  3. 【css】最近使用的两种图标字体库

    ## 0. 前言 比较基础的图标加载:<img src="x.png">和块元素的背景background: url(./x.png). 页面多图标时,使用雪碧图(多个 ...

  4. Android 使用图标字体库

    首先,在assets资源文件下放入图标字体库. 我这儿采用的是fontawesome-webfont.ttf 然后, 在安卓中加载这个资源文件 Typeface fontFace = Typeface ...

  5. fontawesome图标字体库组件在服务器上显示不出来图标的解决

    这个组件在我所开发的网站中被大量使用,为网站增色不少.在本地测试的时候所有图标都能显示出来,可一到服务器上就显示不出来了.网上查列出了可能的原因.其一,IIS没有注册字体类型.经过检查,不存在这个问题 ...

  6. Font Awesome图标字体应用及相关

    作为web开发者,难免要经常要用到些小图标,给自己web增添几分活力和多样性.像这些: 而Font Awesome刚好为我们提供了这些.到目前为止,Font Awesome提供了有500多个可缩放的的 ...

  7. FontAwesome 图标字体库的使用

    在前端开发中,许多新手常会遇见一个问题,参考的网页上有类似下图的图标,但在资源里却找不到对应的文件,这是因为这些网页使用了图标库.这里介绍一种常见的图标库——FontAwesome的使用. 1.登录F ...

  8. 图标字体库（用CSS样式生成搜索、购物车等图标）

    参考网址:http://fontawesome.dashgame.com/ 基本图标: 您可以将Font Awesome图标使用在几乎任何地方,只需要使用CSS前缀 fa ,再加上图标名称. Font ...

  9. Font Awesome:图标字体，完全CSS控制

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

随机推荐

  1. j2ee、mvn、eclipse、Tomcat等中文乱码问题解决方法

    一.更改jdk默认编码为UTF-8,保证启动的JVM不会出现中文乱码问题 1.在编译的时候,如果我们没有用 -encoding 参数指定我们的JAVA源程序的编码格式,则javac.exe首先获得我们 ...

  2. ElasticSearch的按日期排序问题

    ES中有一个sort域,类型为date,格式是: yyyy-MM-dd HH:mm:ss 但是,在实际应用中,想仅仅按yyyy-MM-dd排序.我的处理过程是,用es的script,提取出日期,然后按 ...

  3. dom元素父子容器互相调用控制

    在html中普通的父容器调用子容器中的方法十分简单 因为这两个容器的所有方法和属性都在同一个dom模型中 可以直接控制和使用 但是如果子容器中是一个iframe标签又是怎样的情况? iframe请求另 ...

  4. 常见的Linux系统监控命令

      1.free 显示当前系统未使用的和已使用的内存数目,还可以显示被内核使用的内存缓冲区 -b:以Byte为单位显示内存使用情况: -k:以KB为单位显示内存使用情况: -m:以MB为单位显示内存使 ...

  5. 联想T470设置U盘启动

    联想T470设置U盘启动 学习了:http://www.udaxia.com/upqd/10092.html # F12 in Enter in USB HDD 如果不行: App Menu > ...

  6. 在项目中引用android.support.v7

    在Android开发中,新建的项目可能因为缺少对sopport工程的引用而报错,可以这样解决. 1.项目右键 --> import --> Android --> Existing ...

  7. Java的位运算

    左移位操作 左移位运算的符号为[<<],左移位运算符左面的操作元称作被移位数,右面的操作数称作移位量. 左移位运算是双目运算符,操作元必须是整型类型的数据,其移动过程是:[a <&l ...

  8. mongoDB 删除某一字段、重新名字段

    批量删除字段: {multi:true}:查询到的所有记录都删除. db.collection_name.update({"target_field":{"$exists ...

  9. php中const和static的区别和联系

    1.const是类中的常量,类外用define来定义常量2.const只可以修饰类的属性,不能修饰类的方法,static可以修饰属性,也可以修饰方法3.const和static都属于类本身,而不属于n ...

  10. ionic准备之angular基础——run方法（4）

    可以看到整个angular.module对象具有以下各种属性和方法 <!DOCTYPE html> <html lang="en"> <head> ...