引入第三方图标插件 - fontawesome

官网地址：http://fontawesome.io/

1、下载图标插件包

下载地址：https://codeload.github.com/FortAwesome/Font-Awesome/zip/master

2、解压压缩包

3、导入插件的css

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <link rel="stylesheet" type="text/css" href="Font-Awesome-master/Font-Awesome-master/css/font-awesome.css" />

</head>

<body>

</body>

</html>

4、引用图标代码

  • 找到显示小汽车图标的代码

  • 使用显示小汽车图标的代码

代码

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <link rel="stylesheet" type="text/css" href="Font-Awesome-master/Font-Awesome-master/css/font-awesome.css" />

</head>

<body>

    <i class="fa fa-car" aria-hidden="true"></i> 

</body>

</html>

显示效果

  • 查看更多的例子

web前端之 CSS引入第三方插件的更多相关文章

  1. vue-cli项目中引入第三方插件

    前言 最近有小伙伴问道如何在vue-cli项目中引入第三方插件或者库,例如如果想在项目中使用jQuery中的Ajax请求数据呢?或者我想使用Bootstrap框架呢?等等这些问题,本篇博客将带你学习如 ...

  2. Web前端开发实用的Chrome插件

    Web前端开发实用的Chrome插件 越来越多的前端开发人员喜欢在Chrome里开发调试代码,Chrome有许多优秀的插件可以帮助前端开发人员极大的提高工作效率.尤其Chrome本身是可以登录的,登录 ...

  3. Python web前端 02 CSS

    Python web前端 02 CSS 一.选择器 1.CSS的几种样式(CSS用来修饰.美化网页的) #建立模板 复制内容--->SETTING---> Editor -----> ...

  4. Python web前端 03 CSS属性

    Python web前端 03 CSS属性 一.文字.文本属性 1.文字属性 font-family #字体类型浏览器默认的字体是微软雅黑,字体中有多个字体的时候,如果前面的字体没有就使用后面的字体 ...

  5. Web前端开发人员实用Chrome插件收集

    越来越多的前端开发人员喜欢在Chrome里开发调试代码,Chrome有许多优秀的插件可以帮助前端开发人员极大的提高工作效率.尤其Chrome本身是可以登录的,登录后你所有的插件都会自动同步到每一个登录 ...

  6. WEB前端开发CSS基础样式全面总结

    Web前端开发css基础样式全面总结 颜色和单位的使用 颜色 用颜色的名字表示颜色,比如:red 用16进制表示演示 比如:#FF0000 用rgb数值表示颜色,rgb(红,绿,蓝),每个值都在0-2 ...

  7. ionic3.0--angular4.0 引入第三方插件库的方法

    ionic3.0 引入第三方插件 (swiper),方法很多,现详细说明下官方推荐(typings)做法. 1.全局安装Typings 1. npm install -g typings  2.搜索你 ...

  8. 好程序员web前端分享css常用属性缩写

    好程序员web前端分享css常用属性缩写,使用缩写可以帮助减少你CSS文件的大小,更加容易阅读.css缩写的主要规则如下: 颜色 16进制的色彩值,如果每两位的值相同,可以缩写一半,例如: #0000 ...

  9. 好程序员web前端分享CSS元素类型

    好程序员web前端分享CSS元素类型 目标 1.元素类型分类依据和元素类型分类 2.元素类型的转换 3.inline-block元素类型的应用 4.置换和非置换元素的概念和应用案例 一.元素类型分类依 ...

随机推荐

  1. 利用java反射机制 读取配置文件 实现动态类载入以及动态类型转换

    作者:54dabang 在spring的学习过程之中,我们能够看出通过配置文件来动态管理bean对象的优点(松耦合 能够让零散部分组成一个总体,而这些总体并不在意之间彼此的细节,从而达到了真正的物理上 ...

  2. openwrt上网配置的一些理解

    其实已经有很多帖子讲过openwrt路由器上网配置了,我这里主要是讲我自己的一块硬件路由使用openwrt后的一些上网配置.之所以要研究我自己的配置,是因为硬件,硬件不一样,配置也就不一样,但是总的原 ...

  3. Android中自定义ActionBar的背景色等样式style

    Android中想要去自定义ActionBar的背景色等样式. [折腾过程] 1.自己找代码,发现对应的配置的地方了: AndroidManifest.xml ? 1 2 <applicatio ...

  4. Difference between enabled and userInteractionEnabled properties

    I read through the documentation, and here are my findings. UIButton inherits from UIControl the boo ...

  5. oracle包概述（一）【weber出品】

    一.PL/SQL包概述 1. 什么是PL/SQL包: 相关组件的组合:PL/SQL类型.变量,数据结构,和表达式.子程序: 过程和函数 2. 包的组成部分: 由两部分组成: 包头 包体 3. 包的优点 ...

  6. OC基础 类的三大特性

    OC基础  类的三大特性 OC的类和JAVA一样,都有三大特性:继承,封装,多态,那么我们就来看一下OC中类的三大特性. 1.继承 继承的特点: (1)子类从父类继承了属性和方法. (2)子类独有的属 ...

  7. [Leetcode] Merge Sorted Array (C++)

    我在Github上新建了一个解答Leetcode问题的Project, 大家可以参考, 目前是Java 为主,里面有leetcode上的题目,解答,还有一些基本的单元测试,方便大家起步. 题目: Gi ...

  8. 【干货】.NET开发通用组件发布（一） 介绍

    组件介绍 集合个人和团都开发中遇到的一些通用组件,邮件发送组件.内容采集.CSV数据文件导入工具.日志记录组件.MVC验证登陆组件.MVC分页组件.短信发送组件和强大的Repeate和Repeater ...

  9. mysql_connect(): The mysql extension is deprecated and will be removed in the future: use mysqli or PDO instead in

    从字面的意思上说:这个函数要被弃用,请使用 mysqlli 或者是 PDO 代替 然后就查手册发现没说,大家一定要查官方最新的手册

  10. 根据identifier从StoryBoard中获取对象，UIButton的图片文件位置

    @import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/c ...