web前端之 CSS引入第三方插件

最新推荐文章于 2024-04-05 19:55:00 发布

crazy_zhangcong

最新推荐文章于 2024-04-05 19:55:00 发布

阅读量547

点赞数

本文链接：https://blog.youkuaiyun.com/crazy_zhangcong/article/details/88374411

版权

web前端之 CSS引入第三方插件

引入第三方图标插件 - 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、引用图标代码

首先打开图标展示地址 http://fontawesome.io/icons/
点击需要使用的图标(比如我要使用小汽车的图标)
找到显示小汽车图标的代码
使用显示小汽车图标的代码

代码

<!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>