在網頁設計中，我們經常需要添加搜索功能。為了讓搜索框更美觀，我們會使用CSS來畫搜索圖形。

.search {
border: 2px solid #ccc; /* 給搜索框添加邊框 */
border-radius: 20px; /* 使搜索框外形成為圓角矩形 */
padding: 10px 20px; /* 設置搜索框內文字跟邊框的距離 */
outline: none; /* 去除搜索框點擊時的默認外邊框 */
font-size: 16px; /* 設置搜索框內文字大小 */
width: 300px; /* 設置搜索框寬度 */
background-image: url('search-icon.png'); /* 添加搜索圖標 */
background-size: 20px 20px; /* 設置圖標大小 */
background-repeat: no-repeat; /* 去除圖標重復 */
background-position: 95% center; /* 設置圖標位置 */
}

在上面的代碼中，我們使用了border屬性來給搜索框添加邊框，使用border-radius屬性來設置搜索框為圓角矩形。同時，我們使用padding屬性來設置搜索框內文字與邊框的距離。使用outline屬性來去除搜索框點擊時的默認外邊框，并設置了文字大小、寬度等。最后，使用了background-image屬性來添加搜索圖標，并設置了其大小、位置等。

在HTML中，代碼應該如下：

<input type="text" class="search" placeholder="搜索...">

通過上述代碼和CSS樣式的設置，我們就可以實現一個美觀的搜索框了。