我在视频中添加了海报图片，其尺寸与视频容器本身完全相同：
我的HTML看起来像这样（故意没有指定宽度和高度，因为我希望视频使用浏览器调整大小而不是保持固定）：
<video controls
src="mov/MVI_1880.mp4"
poster="mov/MVI_1880_poster.JPG">
</video>
我的CSS看起来像这样（宽度设置为100％以确保视频使用视口的整个宽度，并在调整浏览器大小时自动调整大小）：
img, video{
width: 100%;
}
但是，在iOS7（iPhone 5S和iPad Mini）的Chrome或Safari中查看时，海报图片左右两侧都有黑条：
试图在此处发布图片链接，但它说我需要至少10个信誉，发布超过2个链接 - 您只需要在我的Flickr网站上找到该图片（请参阅第一页）两个超链接）
如果我专门为视频元素设置了宽度和高度，那么这个问题就会消失：
<video controls width="320" height="180"
src="mov/MVI_1880.mp4"
poster="mov/MVI_1880_poster.JPG">
</video>
试图在此处发布图片链接，但它说我需要至少10个信誉，发布超过2个链接 - 您只需要在我的Flickr网站上找到该图片（请参阅第一页）两个超链接）
但我希望避免这种情况，因为在调整视口大小时视频会保持固定大小。
我已尝试在css中设置auto的高度，但这没有任何改变。
另外值得注意的是，这在我桌面上的Chrome中运行良好（即我没有在HTML中指定宽度或高度，CSS中的宽度为100％），并且海报图像正确地调整为全宽视口：
试图在此处发布图片链接，但它说我需要至少10个信誉，发布超过2个链接 - 您只需要在我的Flickr网站上找到该图片（请参阅第一页）两个超链接）
任何帮助都非常感激。