CSS文本框是一種常用的UI元素，可以用于輸入和編輯文本內容。為了增加交互性和美觀性，我們可以在文本框中添加小圖標。下面介紹兩種方法：

第一種方法是使用CSS偽元素來添加小圖標。具體步驟如下：

/* HTML代碼 */
<input type="text" class="input" placeholder="請輸入內容">
/* CSS代碼 */
.input {
background-color: #fff;
border: 1px solid #ccc;
padding: 10px;
}
.input::before {
content: url(icon.png);
position: absolute;
top: 12px;
left: 12px;
}

在這段代碼中，我們首先定義了一個普通的文本框樣式，然后使用偽元素::before來添加小圖標。其中，content屬性指定要顯示的圖標，position屬性用于定位圖標的位置。

第二種方法是使用CSS background-image屬性來設置文本框背景圖，并使用padding屬性添加內邊距來讓文字與圖標不重疊。具體代碼如下：

/* HTML代碼 */
<input type="text" class="input" placeholder="請輸入內容">
/* CSS代碼 */
.input {
background-color: #fff;
background-image: url(icon.png);
background-position: 10px 10px;
background-repeat: no-repeat;
padding: 10px 10px 10px 40px;
border: 1px solid #ccc;
}

通過設置背景圖、背景位置和內邊距等屬性，我們可以實現在文本框中添加小圖標的效果。