在各種網站中，搜索框是一個非常重要的功能，為了在用戶搜索時提供更好的用戶體驗，我們可以使用CSS和HTML來創(chuàng)建一個漂亮的搜索框。

首先，我們需要使用HTML創(chuàng)建一個搜索框的基礎結構：

<div class="search-container">
<input type="text" placeholder="搜索...">
<button type="submit"><i class="fa fa-search"></i></button>
</div>

然后，我們可以使用CSS樣式來為搜索框添加樣式：

.search-container {
display: flex;
justify-content: center;
margin-top: 50px;
}
input[type="text"] {
width: 300px;
padding: 12px 20px;
margin-right: 10px;
border: none;
border-radius: 20px 0 0 20px;
outline: none;
font-size: 18px;
}
button[type="submit"] {
background-color: #00BFFF;
color: white;
border: none;
border-radius: 0 20px 20px 0;
cursor: pointer;
font-size: 18px;
}
button[type="submit"]:hover {
background-color: #00ACED;
}

這段CSS代碼將搜索框定位在頁面中央，給輸入框添加了邊框半徑，使其外觀更加優(yōu)美，也添加了一些懸停效果，使之在交互過程中看起來更美觀。

這樣的搜索框可以很好地搭配各種網站，為用戶提供更好的搜索使用體驗。