CSS搜索框是網頁設計中常用的一個組件，它可以讓用戶更方便地搜索需要的內容。那么，CSS搜索框該如何添加呢？

首先，我們需要在HTML文件中添加一個input標簽，用來接收用戶的輸入信息。代碼如下：

<input type="text" placeholder="搜索">

然后，我們需要利用CSS來美化搜索框的樣式。我們可以添加如下的CSS樣式：

input[type="text"] {
border: none;  /* 去掉邊框 */
outline: none;  /* 去掉邊框選中狀態 */
padding: 10px;  /* 設置內邊距 */
background-color: #f2f2f2;  /* 設置背景顏色 */
font-size: 16px;  /* 設置字體大小 */
border-radius: 20px;  /* 設置圓角 */
width: 200px;  /* 設置寬度 */
margin: 0 auto;  /* 水平居中 */
}

通過以上CSS樣式，我們可以得到一個簡單的搜索框。但是，如果我們想讓搜索框更美觀一些，比如添加搜索按鈕、添加陰影效果、改變搜索框聚焦時的背景色等等，這些都可以通過CSS來實現。

總之，在網頁設計中，CSS搜索框是一個非常重要的組件，它能夠提高用戶體驗。希望這篇文章能夠幫助您了解CSS搜索框的使用方法。