CSS3寫搜索框和視頻的功能是現代網頁設計中必不可少的。以下是如何使用CSS3編寫搜索框和視頻功能以及一些實用的代碼技巧。

首先，我們來看如何創建一個簡單的搜索框。我們可以使用以下代碼：

<div class="search-box">
<input type="search" placeholder="搜索...">
</div>
.search-box {
display: inline-block;
background-color: #f0f0f0;
border-radius: 5px;
padding: 10px;
}
.search-box input {
border: none;
background-color: transparent;
font-size: 16px;
width: 200px;
height: 30px;
}
.search-box input:focus {
outline: none;
background-color: #fff;
}

這段代碼創建了一個帶有搜索圖標的搜索框。搜索框的背景顏色是灰色的，輸入框的背景顏色是透明的。當輸入框聚焦時，它的背景顏色變為白色。

接下來，我們來看如何在網頁中添加視頻。我們可以使用以下代碼：

<div class="video-container">
<video controls>
<source src="video.mp4" type="video/mp4">
<source src="video.webm" type="video/webm">
<source src="video.ogv" type="video/ogg">
您的瀏覽器不支持HTML5視頻。
</video>
</div>
.video-container {
width: 640px;
height: 360px;
position: relative;
}
.video-container video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

這段代碼將創建一個視頻容器，其中包含一個帶有控件的視頻。當用戶單擊播放按鈕時，視頻將在網頁上播放。此外，我們還可以使用CSS3的transform屬性來添加其他視頻效果，例如3D旋轉。

因此，我們可以根據這些代碼來構建具有搜索框和視頻功能的網頁。這些代碼是可自定義的，例如我們可以更改搜索框背景色或視頻的大小。