css - 如何居中 HTML5 视频?

标签 css html video

我只是在摆弄一些 HTML5,我试图将视频放在页面的中央。出于某种原因,我无法将其置于中心。我试图向视频标签本身添加一个类,并将视频包装在一个单独的 div 中。但是,视频保留在左侧。

<!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>

我知道这一定是我在凌晨忽略的事情,但我们将不胜感激。

谢谢

最佳答案

HTML 代码:

<div>
 <video class="center" src="vd/vd1.mp4" controls poster="dossierimage/imagex.jpg" width="600"></video>
</div>

CSS 代码:

.center {
    margin-left: auto;
    margin-right: auto;
    display: block
}

关于css - 如何居中 HTML5 视频?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5879209/

相关文章:

javascript - 将数组数据传入 div 元素

html - 覆盖 jquery 移动 css

javascript - 如何在 HTML 中随机化幻灯片图像

javascript - 编辑视频按钮

android - 像 facebook , Android 一样自动播放视频

html - 如何使用 Servlet 流式传输 MP3、MP4、AVI 等音频/视频文件

html - 在 X 中没有滚动的固定表格

css - 覆盖 react 原生样式

javascript - 为什么我无法打印重叠矩形的 id?

android - 我的网站无法在 iPhone 上正确缩放