简介
Vanillaaont 是一个基于原始 CSS 的轻量级字体图标库，拥有超过 700 个图标。它可以让你轻松地在前端项目中使用字体图标，增强项目的可读性与美观性。
安装
你可以通过 npm 来安装 Vanillaaont 包。在你的项目根目录下运行以下命令即可实现安装：
--- ------- -----------
使用
你可以在你的 HTML 文件中通过以下代码引入 Vanillaaont：
----- ---------------- -------------------------------------------------
在你的 HTML 文件中使用以下代码来展示一个 Vanillaaont 图标：
-- ----------------------
需要注意的是，你需要将 icon-name 替换为你想要使用的图标名称。你可以在 Vanillaaont 的官方网站（https://vanillaaont.com/icons）上查看所有的图标名称。
示例
下面是一个使用 Vanillaaont 的 HTML 代码示例:
--------- -----
----- ----------
------
----- ----------------
------------------ ----------
----- ---------------- -------------------------------------------------
-------
------
----------- -- -- -------------
------- -- - ----------- ----- -- ---------------------------
-------
-------进阶使用
Vanillaaont 还提供了一些高级用法，你可以使用 CSS 来改变它们的大小和颜色。你可以在你的 CSS 文件中使用以下代码来控制大小和颜色：
---------- -
---------- ----- -- ------ --
------ ---- -- ------ --
-你需要将 icon-name 替换为你想要控制样式的图标名称。
结语
Vanillaaont 可以帮助你在前端项目中使用字体图标，从而让你的页面增加美观性和可读性。在你的下一个项目中体验一下吧！
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60055cb681e8991b448da328