css - 为什么我不能让 HTML 视频标签顶部对齐？

Question

我的目标是让视频占据 1080p 屏幕顶部的 90%，留下底部的 10% 用于文本。

无论我尝试什么，视频似乎都不合适或对齐。

使用 html 视频标签是否有技巧？

 <table style="width:1080px;height:100%;background-color:#888">
  <tr valign="top">
    <td width="1080px" height="90%" valign="top">
<video width="1080px" height="100%" src="video.mp4" autoplay loop></video>
    </td>
  </tr>
    <tr>
    <td>TEXT</td>
  </tr>
</table>

例子:

https://jsfiddle.net/1u1xc1sL/

Answer 1

使用 CSS:

video {
  //how far from top
  top: 0px;
}

<video style="background-color: black;" width="1080px" height="100%" src="video.mp4" autoplay loop>Your bowser dooes not support the video tag</video>