CSS是前端開發(fā)中十分重要的一部分，除了控制網(wǎng)站的布局、字體、色彩等方面，還可以通過CSS給網(wǎng)站添加小圖標，增加網(wǎng)站的美觀程度。那么，CSS如何加小圖標呢？
首先，在CSS中我們需要使用偽元素::before或::after來實現(xiàn)添加小圖標的效果。例如以下代碼：

p::before {
content: "";
display: inline-block;
width: 20px;
height: 20px;
background-image: url("圖標路徑");
}

其中，content屬性實際上是給偽元素添加了一個空的內(nèi)容，這是必要的。display屬性設(shè)置為inline-block可以讓偽元素與p元素同行顯示。width和height屬性分別設(shè)置偽元素的寬度和高度。background-image屬性則指定了偽元素使用的圖標路徑，可以通過圖片的相對路徑或絕對路徑來引用。
在這個例子中，我們實現(xiàn)了在p標簽前添加一個寬高為20px的小圖標。但是如何讓小圖標與文字對齊呢？可以通過vertical-align屬性來實現(xiàn)，例如：

p::before {
content: "";
display: inline-block;
width: 20px;
height: 20px;
background-image: url("圖標路徑");
vertical-align: middle;
}

這里將vertical-align屬性設(shè)置為middle，讓偽元素與文字垂直居中對齊。另外，我們也可以根據(jù)實際需要設(shè)置不同的屬性值，如設(shè)置background-repeat屬性為no-repeat，讓圖標只顯示一次。
總之，通過偽元素和相關(guān)CSS屬性，我們可以輕松地實現(xiàn)在網(wǎng)站中添加小圖標，使網(wǎng)站更加美觀，更具有吸引力。