参见英文答案 >
Shrink a YouTube video to responsive width 9个
我使用标准的Youtube嵌入代码,如：
我使用标准的Youtube嵌入代码,如：
<div style="width:100%; max-width:800px;">
<iframe width="960" height="720" src="http://www.youtube.com/embed/VIDEO_ID"
frameborder="0" allowfullscreen></iframe>
</div>
我添加了iframe {width：100％;在style.css中它起作用(它的新宽度是最大800px)但它不适应高度…高度：自动;和身高：100％;使它像100px高或720px高(太高).
有没有什么方法可以让YouTube视频在响应式容器中保持16：9的宽高比(可以有1px到800px的任何宽度)？
解决方法
那么你的宽度和高度可能会被iFrame的width和height属性覆盖.如果你取出静态宽度和高度,它应该正确响应.
<div style="width:100%; max-width: 800px;"> <iframe src="http://www.youtube.com/embed/VIDEO_ID" frameborder="0" allowfullscreen></iframe> </div>
请注意iframe中没有width =“XXX”或height =“XXX”.
查看this article以获取更多信息.
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [email protected] 举报，一经查实，本站将立刻删除。
