如何集中HTML5视频? [英] How to center HTML5 Videos?
本文介绍了如何集中HTML5视频?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我只是搞砸了一些HTML5,我试图在视频中心的页面。由于某种原因,我不能得到它的中心。我试图添加一个类到视频标签本身,我已经将该视频包装在一个单独的 div
。但是,视频仍在左侧。
I'm just messing around with some HTML5, and I was trying to center a video on the page. For some reason I can't get it to center. I've tried to add a class to the video tag itself, and I've wrapped the video in a separate div
. However, the video stays on the left.
<!DOCTYPE HTML>
<html>
<head>
<title>Test</title>
<script type="text/css">
.center {
margin: 0 auto;
}
</script>
</head>
<body>
<div class="center">
<video controls="controls">
<source src="/media/MVI_2563.ogg" type="video/ogg" />
Your browser does not support the video tag.
</video>
</div>
</body>
</html>
我知道这必须是我在早晨的时候忽略的东西,将不胜感激。
I know this must be something I'm overlooking in the wee hours of the morning, but any help would be appreciated.
感谢
推荐答案
中心类必须具有宽度以使汽车保证金工作:
The center class must have a width in order to make auto margin work:
.center { margin: 0 auto; width: 400px; }
然后我会将中心类应用于视频本身,而不是一个容器:
Then I would apply the center class to the video itself, not a container:
<video class='center' …>…</video>
这篇关于如何集中HTML5视频?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文