介绍
Typicons 是一个免费的图标字体库，拥有超过 700 个精美的矢量图标，可用于 Web、移动端和桌面应用程序。通过 npm 包管理工具，在前端项目中轻松使用 Typicons。
安装
首先，在你的项目目录下打开终端窗口，并运行以下命令安装 Typicons：
--- ------- -------------
引用
在 HTML 文件中引用 typicons.css 和 typicons.font.js 文件即可开始使用 Typicons。
--------- -----
------
------
----- ----------------
--------------- ---------------
----- ---------------- ----------------------------
-------
------
---- -- -------- -- ---
----- ------------ -------------------
---- -- ---------- -- ---
------- ----------------------------------------
-------
-------使用方法
1. CSS 类名
为了在网页中使用 Typicons 图标，需要将相应的图标类名添加到 HTML 元素中。例如，要使用“star”（星星）这个图标，可以在元素中添加 .typcn-star 这个类名：
----- ------------ -------------------
2. Unicode
Typicons 字体库还提供了一些 Unicode 实体，可以直接在 HTML 中使用。例如，要使用“star”（星星）这个图标，可以使用  这个 Unicode 实体：
----- -----------------------------
3. JavaScript
Typicons 字体库还提供了一个 JavaScript API，可以动态生成图标。
----- ---- - ------------------------- ----- ------ - ------------- ----------------------------------
示例代码
下面是一个完整的示例代码，演示如何使用 Typicons 图标：
--------- -----
------
------
----- ----------------
--------------- ---------------
----- ---------------- --------------------------------------------------------
-------
------
---- -- --- -- ---
----- ------------ -------------------
---- -- ------- ---
----- -----------------------------
---- -- ---------- ---
------- --------------------------------------------------------------------
--------
----- ---- - -------------------------
----- ------ - -------------
----------------------------------
---------
-------
-------总结
Typicons 提供了超过 700 个精美的矢量图标，可以轻松地在前端项目中使用。通过 npm 包管理工具安装 Typicons 后，只需在 HTML 文件中引用相应的 CSS 和 JavaScript 文件，即可开始使用 Typicons。在网页中使用 Typicons 有多种方法，包括使用 CSS 类名、Unicode 和 JavaScript API。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/35268