CSS小圖標庫是前端開發中常用的一種資源庫。它提供了一系列簡單的小圖標，如箭頭、筆、搜索等，在網頁中使用時可以起到很好的效果。下面給大家介紹幾個常用的CSS小圖標庫。 第一個圖標庫是Font Awesome。它是最受歡迎的圖標庫之一，提供了超過2000個圖標，可以使用CSS或JS引用。該庫的圖標都采用矢量圖形制作，支持響應式設計和Retina屏幕。 第二個圖標庫是Material Design Icons。該庫提供了700多種采用Google Material Design風格的圖標。這些圖標都是根據Google Material Design 指南進行制作的，可以使用CSS或JS進行引用。Material Design Icons可以自由地進行二次開發。 第三個圖標庫是Glyphicons。這個圖標庫主要是為Bootstrap用戶開發的，提供了200多個圖標。這些圖標都是采用矢量圖形制作的，可以按照需要進行顏色、大小的調整。 以上是三個常用的CSS小圖標庫，它們都可以讓開發者在網頁中輕松地加入漂亮的小圖標。下面介紹一下在使用CSS小圖標時，如何利用pre標簽來優化代碼。 pre標簽是用來顯示預格式化文本的標簽，它會將文本的所有空格、換行及其他格式都保留下來。在使用CSS小圖標庫時，我們可以將所有相關代碼放在pre標簽內，讓代碼更加清晰易讀。 舉個例子，以下是一個使用Font Awesome庫的HTML代碼：

搜索

我們可以將其優化為以下代碼：

<i class="fa fa-search" aria-hidden="true"></i>
搜索

這樣，我們的代碼就可以更加清晰易讀。通過合理使用CSS小圖標庫和pre標簽，可以讓我們的網站更加美觀、易讀，提升用戶體驗。