注意：本教程需要您已经安装了 npm 和 Node.js 环境
什么是 Cochae-icons-css？
Cochae-icons-css 是一个轻量的、响应式的 CSS icon 库，库中包含超过 500 个 SVG 图标。它不仅提供了适用于 Web、应用程序和印刷品的各种尺寸和颜色的图标，还支持自定义图标的颜色、大小和阴影等属性。Cochae-icons-css 采用模块化设计，使用简单、易扩展。
如何安装 Cochae-icons-css？
要使用 Cochae-icons-css，您首先需要在项目中安装它。这可以通过 npm 包管理器完成。使用以下命令：
npm install cochae-icons-css --save
如何使用 Cochae-icons-css？
将 Cochae-icons-css 包导入到您的代码中：
import 'cochae-icons-css/dist/cochae-icons.css';
接下来，您就可以在您的代码中使用 Cochae-icons-css 的各种图标了。只需要通过添加样式类到 HTML 中即可：
<i class="ci ci-heart"></i>
此代码会在页面上渲染一个心形状的图标。不仅如此，Cochae-icons-css 还支持自定义图标的样式和颜色，您只需添加相应的 CSS 样式即可。例如，要更改图标的颜色，只需在样式表中添加以下代码：
.ci-heart {
color: red;
}为什么使用 Cochae-icons-css？
相对于其他 icon 库，Cochae-icons-css 具有以下几个优点：
- 轻量：Cochae-icons-css 图标库不仅大小小，而且只有在使用时才会加载，这可以从根本上提高您网站或应用程序的加载速度
- 响应式：Cochae-icons-css 图标库中的每一个图标都是响应式的，这意味着它们可以适应不同尺寸的屏幕，并且在不同大小的设备上都显示得非常好
- 高度可定制：Cochae-icons-css 不仅支持自定义图标颜色、大小和阴影等属性，而且还可以自由组合不同的图标创建您自己的图标（这是许多其他 icon 库所不具备的）
示例代码
-- -------------------- ---- -------
--------- -----
----- ----------
------
----- ----------------
-------------------
----- ---------------- -----------------------------------------------------------
-------
--------- -
------ ----
---------- -----
------------ --- --- --- -----
-
--------
-------
------
-- --------- --------------
-------
-------这段代码会在页面上渲染一个红色心形的图标，并给它增加了一些阴影和大小。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005678f81e8991b448e3ec5