文章目录

  • 前言
  • 具体操作
  • 总结


前言

Bootstrap 官方图标库
拥有近 1500 个图标的免费、高质量的开源图标库。你可以以任何方式使用它们,例如 SVG 矢量图、SVG sprite或 web 字体形式。并不局限于使用 Bootstrap 前端框架的项目。本文将进行介绍如何下载使用。


具体操作

1.访问Bootstrap官方图标库下载网站

https://icons.bootcss/#install

2.点击安装

3.此处下载压缩包到本地(可以任选一种)
4.点击 bootstrap-icons-1.7.2.zip 进行下载


5.保存文件,将里面的文件解压,全部复制到软件中
IDEA要复制到web目录下
6.创建一个新的HTML页面,进行使用
使用代码如下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<img src="./bootstrap-icons-1.7.2/check2.svg" alt="Bootstrap" width="30" height="30">

</body>
</html>

7. 页面效果
8.更多图标,请参考帮助文档的图片列表
https://icons.bootcss/#install

例如:想使用bootstrap定义的闹铃图标,只需要复制图标下面的字符即可,此处为alarm.svg

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<img src="./bootstrap-icons-1.7.2/alarm.svg" alt="Bootstrap" width="30" height="30">
</body>
</html>

总结

Bootstrap图标库提供了很多图标供我们使用,使开发更便捷,不会再为图标而烦恼了,关于Bootstrap图标库的更多介绍请参考官网
https://icons.bootcss/#install


更多推荐

Bootstrap图标库的下载与使用