0

有人问了一个类似的问题（https://stackoverflow.com/a/15094340/1822824），他们收到了一个没有代码的基本答案。我听从了他们的建议并创建了自己的代码。

我正在尝试在 iPhone 图像框架内播放 HTML5 视频。像这样：

在此处输入图像描述

我的图像是 300 像素 x 629 像素。问题是我在 Safari 6（我的目标浏览器）中得到一个垂直滚动条，即使窗口大到可以查看。滚动条也出现在我的代码 Fiddle 上。

为什么我得到这个垂直滚动条？

我的代码如下：

小提琴：http: //jsfiddle.net/rZYTn/

HTML

<div class="myVideo">
<video width="253" height="447" controls autoplay>
  <source src="videos/keyboard.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>
</div>

CSS

.myVideo {
    background-image: url(iphone.png);
    background-repeat:no-repeat;
    width: 300px;
    height: 629px;
    padding-top: 93px;
    padding-left: 25px;
    overflow:hidden;
}

Fiddle 上的额外空间和滚动条：

在此处输入图像描述

4

1 回答 1

0

额外空间是由于视频大小和 div 大小（宽度和高度）

使固定

.myVideo {
    background-image: url(iphone.png);
    background-repeat:no-repeat;
    width: 254px;
    height: 455px;
    padding-top: 10px;
    padding-left: 25px;
    overflow:hidden;
}

这也可能会删除滚动条。

于 2013-09-20T08:54:48.703 回答