利用影片當背景可以讓整個版面看起來更活潑，而在 CSS3 出來之後就可以透過 video 標籤搭配 CSS 的 object-fit 來製作可以隨著區塊大小的影片背景了。
首先我們可以準備這樣的 HTML：
<div class="container">
<video src="video.mp4" autoplay muted loop></video>
</div>這裡我用一個容器把 video 包起來，video 就直接設定 autoplay: 自動播放、muted: 靜音以及 loop: 循環播放，注意這邊一定要設定靜音才能夠讓影片自動播放。
接著設定 CSS:
.container{
position: relative;
}
.container video{
position: absolute;
left:0;
top:0;
width: 100%;
height: 100%;
object-fit: cover;
}
上面那段就是利用 object-fit 讓影片可以跟著容器變化，object-fit 的介紹可以看這篇，這樣就完成了。
![[Tailwind CSS] 設定 h1~h6 等標籤的文字大小](/assets/upload/1611643654838_0.jpg)
