<video controls>
<source src="video.mp4" type="video/mp4">
<source src="video.webm" type="video/webm">
Your browser does not support the video tag.
</video>在这段代码中，大家可以看到HTML5 video标签，其中，controls属性表示要显示控制器。source标签用于指定视频源，这里大家提供了两种不同格式的视频源。如果浏览器不支持视频标签，则会显示“Your browser does not support the video tag.” 文本。
CSS可以通过一些属性来控制视频的外观和交互效果。例如，大家可以使用object-fit属性来缩放和定位调整视频大小。大家还可以使用:hover伪类来创建悬停效果，例如在鼠标悬停在视频周围时显示控制器。
video {
object-fit: cover;
}
video:hover {
cursor: pointer;
}
video:hover::controls {
opacity: 1;
}在这段CSS代码中，大家使用了object-fit属性来控制视频的大小和定位。大家还使用:hover伪类来更改鼠标的样式，并通过::controls选择器来更改控制器的透明度。
总的来说，CSS Video是一个非常有用的技术，在网页设计和交互中发挥着重要作用。开发人员可以使用HTML5 video标签和CSS属性来控制视频的外观和交互效果，从而为用户提供更加优秀的浏览体验。