bootstrap图标的使用

nncwww

于 2022-05-04 15:17:25 发布

阅读量4.4k

点赞数 2

CC 4.0 BY-SA版权

文章标签： bootstrap html css

本文链接：https://blog.youkuaiyun.com/nncwww/article/details/124571049

本文介绍了如何在HTML中引入并使用Bootstrap图标。首先，访问Bootstrap官网下载图标库，然后将font包导入项目中，并在HTML中引入bootstrap.css和bootstrap-icons.css样式文件。通过复制图标代码，可以轻松在页面中插入所需图标。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在html里面使用bootstrap图标

首先进入bootstrap的官网va.bootcss.com

进入点击画圈的地方来到下面这一张图

点击安装根据步骤完成后得到一个安装包

解压到当前文件后倒入软件后就可以使用啦

使用前我们需要导包

将font包放入我们的项目中

导入到我们的项目中

<!-- 引入Bootstrap的样式-->
		<link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
		<!-- 引入Bootstrap的图标样式 -->
		<link rel="stylesheet" type="text/css" href="font/bootstrap-icons.css"/>

使用方法点击需要使用的图标

点击copy后放入需要使用的地方即可

效果图