CSS搜索欄怎么設置
搜索欄在網站中十分常見，為了使搜索欄更美觀，我們可以使用CSS來設置其樣式。下面是一個簡單的CSS搜索欄設置教程。
首先，我們需要有一個HTML搜索欄：

<form class="search-form">
<input type="text" placeholder="Search">
<button type="submit">Search</button>
</form>

其中，我們使用了form、input和button標簽。接下來，我們使用CSS來設置每個元素的樣式。代碼如下：

/* 搜索表單樣式 */
.search-form {
display: flex; /*使用flex布局*/
align-items: center; /*垂直居中*/
}
/* 搜索輸入框樣式 */
.search-form input[type=text] {
padding: 10px; /*內邊距*/
border: none; /*邊框不要*/
border-radius: 5px; /*圓角*/
outline: none; /*點擊無邊界*/
}
/* 搜索按鈕樣式 */
.search-form button[type=submit] {
padding: 10px; /*內邊距*/
background-color: #333; /*背景色*/
color: #fff; /*文字顏色*/
border: none; /*邊框不要*/
border-radius: 5px; /*圓角*/
margin-left: 5px; /*間距*/
}

代碼解釋：
1. .search-form樣式：將搜索表單使用flex布局，并使其垂直居中。
2. .search-form input[type=text]樣式：使輸入框有10px的內邊距，無邊框，圓角，點擊時無邊界。
3. .search-form button[type=submit]樣式：使按鈕有10px的內邊距，背景色為#333，文字顏色為#fff，無邊框，圓角，左側間距為5px。
使用以上代碼，就可以使搜索欄更美觀了。當然，你可以修改上述樣式，以符合你所需的樣式。