对中<video>问题
对中<video>问题
提问于 2021-06-10 19:43:27
我用这种方式：
.centr {
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}这个网站是这样的：
问题是图片中的图片，它没有到位。
回答 2
Stack Overflow用户
回答已采纳
发布于 2021-06-10 19:53:02
在父div中对<video>元素进行对中的一种方法是使用一个柔性盒：
.container {
/* just styling, nothing important */
background-color: gray;
width: 500px;
height: 200px;
/* note these lines below */
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
video {
width: 300px;
height: 150px;
background-color: #000;
}<div class="container">
<video></video>
</div>
Stack Overflow用户
发布于 2021-06-10 19:55:28
要使自动边距正常工作，中心类必须有一个宽度：
.center {
margin: 0 auto;
width: 400px;
}然后，我会将中间类应用于视频本身，而不是一个容器：
<video class='center'>
</video>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/67927566
复制相关文章
相似问题
腾讯云开发者
