在CSS中，可以使用border-radius屬性來制作搜索框的弧度，以下是一些示例代碼，展示如何為搜索框添加弧度：

搜索框弧度示例

HTML結(jié)構(gòu)

<input type="text" class="search-input">

CSS樣式

.search-input {
  padding: 10px;
  border: 2px solid #333;
  border-radius: 10px; /* 弧度大小可以根據(jù)需要調(diào)整 */
}

圓角搜索框

如果你想要一個(gè)圓角的搜索框，可以將border-radius設(shè)置為一個(gè)較大的值，

.search-input {
  border-radius: 50px; /* 弧度大小可以根據(jù)需要調(diào)整 */
}

弧形搜索框

如果你想要一個(gè)弧形的搜索框，可以使用border-top-left-radius和border-top-right-radius來控制弧形的形狀：

.search-input {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

半圓搜索框

如果你想要一個(gè)半圓形的搜索框，可以將border-radius設(shè)置為一個(gè)較大的值，并添加一些額外的樣式：

.search-input {
  border-radius: 50px; /* 弧度大小可以根據(jù)需要調(diào)整 */
  width: 100px; /* 寬度根據(jù)需要調(diào)整 */
  height: 20px; /* 高度根據(jù)需要調(diào)整 */
  padding: 5px; /* 內(nèi)邊距根據(jù)需要調(diào)整 */
}

弧形底部搜索框

如果你想要一個(gè)弧形底部的搜索框，可以使用border-bottom-left-radius和border-bottom-right-radius來控制弧形的形狀：

.search-input {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

通過調(diào)整border-radius屬性的值，你可以制作出不同形狀和大小的弧形搜索框，希望這些示例能幫助你實(shí)現(xiàn)所需的樣式效果！