CSS 小图标通常是通过字体图标库来实现的，比如 Font Awesome、Ionicons、Material Icons 等。这些库提供了一套图标字体，可以通过 CSS 类名来引用。下面是一个简单的例子，展示了如何使用 Font Awesome 来显示一个图标：

```htmlExample of CSS Icon .icon { fontsize: 24px; / 设置图标大小 / color: 333; / 设置图标颜色 / }

你可以根据自己的需要修改图标的大小、颜色和类型。只需确保你的网页引入了相应的图标库。

CSS小图标制作指南

一、CSS小图标的基本原理

CSS小图标主要通过以下几种方式实现：

1. 使用伪元素：通过`:before`和`:after`伪元素，结合`content`属性，可以创建出各种形状的图标。

2. 利用border属性：通过调整边框的样式、颜色和宽度，可以绘制出简单的图形。

3. 背景图片：将图标绘制在一张图片上，通过CSS的背景属性显示出来。

二、使用伪元素制作小图标

以下是一个使用伪元素制作搜索图标的示例：

```css

.icon-search {

width: 12px;

height: 12px;

border-radius: 100%;

border: 2px solid currentColor;

position: relative;

margin: 30px auto;

.icon-search:after {

content: \