ビデオを水平に中央揃えする方法

CSSを使用した方法:
- ビデオの親要素に対して、display: flex; justify-content: center;のCSSプロパティを追加します。これにより、ビデオが水平方向に中央揃えされます。
```
.video-container {
 display: flex;
 justify-content: center;
}
```
- ビデオ要素自体にmargin: 0 auto;を追加することで、ビデオを水平方向に中央揃えすることもできます。
```
.video {
 margin: 0 auto;
}
```
HTMLとCSSを使用した方法:
- ビデオ要素を<div>要素で囲みます。
```
<div class="video-container">
 <video class="video" src="example.mp4"></video>
</div>
```
- CSSでtext-align: center;を使用して、ビデオを水平方向に中央揃えします。
```
.video-container {
 text-align: center;
}
```

JavaScriptを使用した方法:

JavaScriptを使用して、ビデオ要素の幅を取得し、親要素の幅から引いた余白を計算します。

function centerVideo() {
 var video = document.getElementById('video');
 var container = document.getElementById('container');
 var margin = (container.offsetWidth - video.offsetWidth) / 2;
 video.style.marginLeft = margin + 'px';
}
window.addEventListener('resize', centerVideo);

HTMLでビデオ要素と親要素を定義し、JavaScript関数を呼び出します。

<div id="container">
 <video id="video" src="example.mp4"></video>
</div>
<script>
 centerVideo();
</script>

このようにして、ビデオを水平に中央揃えするためのシンプルで簡単な方法といくつかのコード例を提供しました。これらの方法を使用して、ビデオを中央揃えすることができます。