Web 图标 - 简介

图标是用于表示网页上的特定操作或功能的符号。图标用于文档和应用程序，它们可以是可选择的，也可以是不可选择的。例如，我们在应用程序的按钮上看到的图像都是图标，并且这些按钮是可选择的。同样，当我们使用图标作为公司徽标时，它通常是不可选择的。

在Windows环境下，如果我们将系统音量静音，则会以图标的形式表示，如下图。

使用网络图标，我们可以表示加载页面、禁用选项、链接、重定向等。这些图标可以翻转、旋转、调整大小、加边框、反转和着色。

图标字体

图标字体包含符号和字形。加载所需的字体后，您可以使用该字体提供的任何图标（使用图标的类名称）。我们还可以对图标应用不同的颜色，并使用 CSS 属性调整它们的大小。有几个提供图标的图标库（字体）。本教程重点介绍三种主要字体，即 -

此字体提供 519 个免费可缩放矢量图标。该库完全免费，可供个人和商业用途。这些图标可以轻松定制。最初，它们是为 Bootstrap 开发的。

这是一个单色图标库，提供光栅图像格式、矢量图像格式和字体。它提供了超过 250 个字体格式的字形。您可以在您的 Web 项目中使用这些字体。这些图标不是免费的，但是您可以在基于 Bootstrap 的项目中使用它们，而无需购买它们。

Google 提供了大约 750 个根据“材料设计指南”设计的图标，这些图标被称为材料设计图标。这些图标很简单，并且支持所有现代网络浏览器。由于这些图标是基于矢量的，因此它们也是可缩放的。要使用这些图标，我们必须加载字体（库）material-icons。