Html 如何制作<；视频></视频>；在div center中添加标签而不显示视频？

它将我的视频居中，并将控件放在divs底部，但视频会溢出。在css样式表中，css似乎无法识别。因为样式表中的颜色是黑色的。我用铬

div.video\u div{
宽度：800px；
高度：300px；
边框：1px纯红；
背景颜色：蓝色；
保证金：0自动；
}
录像带{
宽度：100%；
身高：100%；
对象匹配：覆盖；
}

视频
您的浏览器不支持视频标记。

尝试添加规则溢出：隐藏；到您的div.video\u div规则：

div.video_div{
    width:800px;
    height:300px;
    border:1px solid red;
    background-color:blue;
    margin:0 auto;
    overflow: hidden; /* Add this */
}
video{
    width:100%;
    height:100%;
    /* Use contain instead if you want the object to fit without cropping */
    object-fit: cover; 
}

“对象匹配：覆盖”属性将缩放视频，保留纵横比。这可能会使其部分溢出边界。溢出：周围div上的隐藏CSS隐藏此溢出。您可能还希望改用object-fit:contain，这将保留纵横比，但使视频完全适合盒子内部。（您可以签出以查看各种值。）

具有工作视频源的JSFIDLE示例：

---

所谓“视频倾诉”，您的意思是希望视频集中并包含，而不是覆盖/裁剪？您应该使用

object-fit:contain

，而不是

object-fit:cover

。在演示中看到这里的区别（向下滚动）：是，而不是croping。对象匹配：包含；不拉伸100%在div中，它显示在中等高度。但现在比以前好了。对象匹配：填充；看起来我需要的东西只是视频得到了压缩的高度。我需要它在原始像素的全宽。和高度一样，它将在背景封面效果css。和中心它。thnx它的作品你是惊人的！我使用对象匹配：封面；视频的中心是……你很好：）