背景に動画を敷く場合のhtml、cssコード

​

■html

<div class="row">
<div class="col">
<!-- 動画背景 -->
<div class="wrap">
<!-- 背景用の動画ファイル -->
<video id="bg-video" src="https://beethoven.co.jp/lp/wp-content/uploads/2020/12/seminar.mp4" poster="poster.jpg" autoplay loop></video>
<!-- 背景の上に表示させたいコンテンツ -->
<div class="header-title">
<p>
コンテンツが入ります
</p>
</div>
</div>
</div>
</div>

■css

/* ----- 背景用の動画ファイル ----- */
#bg -video{
position: fixed;
right: 0;
bottom: 0;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -100;
background: url('poster.jpg') no-repeat;
background-size: cover;
}
/* ----- 背景の上に表示させたいコンテンツ ----- */
.header-title{
position: relative; /*必ず必要*/
z-index: 2; /*必ず必要*/
display: flex;
width: 50%;
justify-content: center;
align-items: center;
text-align:center;
margin: auto;
}