代碼圖標是網站開發中經常用到的一個特性，可以讓網站更加美觀和易讀。而CSS添加代碼圖標可以更加方便和快捷地實現這個效果。
首先，在CSS中添加代碼圖標需要使用特殊的字體庫，比如FontAwesome。這個字體庫包含了很多不同的圖標，包括代碼圖標以及其他的圖標。我們需要在HTML頭部引入這個字體庫的CSS文件，例如：
``````
接下來，我們可以使用CSS選擇器來為代碼元素添加圖標。比如，我們可以使用以下CSS代碼為所有帶有“code”類的元素添加圖標：
```CSS
p code:before {
font-family: "Font Awesome 5 Free";
content: "\f121";
margin-right: 5px;
}
```
在這個代碼中，我們使用了:before偽元素來添加一個圖標。在content屬性中，我們指定了使用FontAwesome字體庫中的代碼圖標（對應的Unicode碼是f121）。同時，在margin-right屬性中，我們為圖標添加了一些右邊距，讓它與后面的代碼更好地分離。
這樣，在我們的HTML代碼中使用類似以下形式的代碼時，就會自動添加代碼圖標了：
```HTML
這是一段含有代碼的文字。