CSS中的before伪类可以用来添加小图标或样式到元素的前面。比如，我们可以在超链接前添加一个小箭头，以表示该链接将跳转到另一个页面。

a:before {
content: '';
display: inline-block;
width: 6px;
height: 6px;
margin-right: 4px;
border-top: 2px solid #000;
border-right: 2px solid #000;
transform: rotate(45deg);
}

在上面的代码中，我们定义了一个a标签的before伪类，并设置了其样式。我们首先使用content属性将其内容设置为空，则before伪类不会有文字显示。接着，我们使用display: inline-block，将其变成inline block元素，方便使用它的宽度和高度样式设置。然后，我们设置它的宽度和高度均为6px，并将其margin-right设置为4px，使其与超链接间有一点距离。

我们接下来使用border-top和border-right属性，设置上和右两条边框，形成了一个类似于箭头的图形。最后，我们使用transform: rotate(45deg)将这个图形旋转45度，使其看起来更像箭头。

使用before伪类添加小图标可以为网页增加趣味性和可读性。只需要运用一些CSS知识，我们就能轻松地为我们的网页添加一些小巧别致的小图标。