CSS代圖標的textbox是一種很方便的功能，可以讓我們在設計網站時更加自由地使用圖標。下面是一個使用CSS代圖標的textbox的例子：

<div class="textbox">
<label>搜索:</label>
<input type="text">
<i class="icon-search"></i>
</div>

其中，class="icon-search"就是我們要使用的CSS代圖標。

為了在CSS中定義這個圖標，我們可以使用:before偽元素：

.icon-search:before {
content: "\f002";
font-family: FontAwesome;
font-size: 16px;
display: inline-block;
margin-right: 5px;
font-style: normal;
font-weight: normal;
text-decoration: inherit;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

上面的代碼中，content屬性定義了要顯示的圖標的Unicode碼（"\f002"是FontAwesome字體庫中的搜索圖標）。font-family屬性指定了要使用的字體庫（這里使用的是FontAwesome）。display、margin-right等屬性指定了圖標的顯示樣式和位置。

在HTML中，我們只需要使用即可在輸入框旁邊顯示搜索圖標。而且，如果要使用其他圖標，只需要修改class屬性的值，再在CSS中添加相應的:before樣式即可。