在CSS中創(chuàng)建一個搜索欄，可以通過HTML和CSS的結(jié)合來實現(xiàn)，以下是一個簡單的示例，展示如何在CSS中創(chuàng)建一個基本的搜索欄。

1、HTML結(jié)構(gòu)：我們需要一個HTML元素來承載搜索欄，一個簡單的搜索欄可以由一個輸入框和一個提交按鈕組成。

<div class="search-bar">
    <input type="text" class="search-input" placeholder="搜索...">
    <button class="search-button">搜索</button>
</div>

2、CSS樣式：我們將使用CSS來美化搜索欄，我們可以設(shè)置輸入框和按鈕的寬度、高度、顏色等屬性。

.search-bar {
    width: 300px;
    height: 40px;
    display: flex;
    align-items: center;
    border: 1px solid #ccc;
    border-radius: 5px;
    margin: 10px 0;
}
.search-input {
    flex: 1;
    height: 100%;
    border: none;
    outline: none;
    padding: 0 10px;
}
.search-button {
    height: 100%;
    border: none;
    outline: none;
    background-color: #007bff;
    color: #fff;
    padding: 0 10px;
    border-radius: 5px;
    margin-left: 10px;
}

3、交互功能：為了讓搜索欄更加實用，我們可以為它添加一些交互功能，比如當輸入框獲得焦點時，顯示一個放大鏡圖標，這可以通過JavaScript來實現(xiàn)。

document.querySelector('.search-input').addEventListener('focus', function() {
    this.style.border = '1px solid #007bff';
});
document.querySelector('.search-input').addEventListener('blur', function() {
    this.style.border = 'none';
});

通過以上步驟，我們已經(jīng)在CSS中創(chuàng)建了一個基本的搜索欄，并為其添加了簡單的交互功能，這只是一個簡單的示例，你可以根據(jù)自己的需求進行進一步的定制和優(yōu)化。