CSS3搜索框是一種漂亮而實用的界面設計，在網站開發中得到廣泛應用。下面演示了一些基本的CSS3搜索框代碼。

/* 主容器 */
.search-container {
position: relative;
margin: 20px auto;
width: 300px;
}
/* 輸入框樣式 */
.search-container input[type="text"] {
width: 100%;
height: 40px;
padding: 10px;
font-size: 16px;
border: 1px solid #ccc;
border-radius: 5px;
outline: none;
box-shadow: none;
}
/* 搜索按鈕樣式 */
.search-container button[type="submit"] {
position: absolute;
top: 0;
right: 0;
width: 90px;
height: 40px;
padding: 0;
background-color: #f44336;
color: #fff;
font-size: 16px;
border: none;
border-radius: 0 5px 5px 0;
outline: none;
cursor: pointer;
transition: background-color .3s;
}
/* 搜索按鈕懸浮效果 */
.search-container button[type="submit"]:hover {
background-color: #f55d4e;
}

以上代碼定義了一個名為search-container的容器，其中包含一個文本輸入框和一個按鈕。容器設置了相對定位，輸入框設置了邊框、圓角和陰影，按鈕設置了絕對定位、背景色、圓角和鼠標懸浮效果。

這些代碼并不復雜，但卻可以創造出一個漂亮實用的搜索框效果。