我有一个YouTube视频，我想放在我的网页上。
我想要缩放视频以适应用户浏览器的百分比，但也要保持宽高比。
我试过这个：
<iframe width="87%" height="315" src="http://www.youtube-nocookie.com/embed/dU6OLsnmz7o" frameborder="0" allowfullscreen></iframe>
但这只会使播放器更宽，而不是更高。
我是否必须诉诸于JavaScript(或非标准CSS)？
解决方法
在开发一些响应式的CSS时，我遇到类似的问题。我想要任何嵌入式Youtube对象调整大小，方面，当从桌面CSS切换到更小的(我使用媒体查询重新呈现移动设备的内容)。
我解决的解决方案是CSS和标记。基本上，我的CSS中有三个视频类：
.video640 {width: 640px; height: 385px}
.video560 {width: 560px; height: 340px}
.video480 {width: 480px; height: 385px}
…我将其中一个分配到我包括的Youtube内容，这取决于它的原始大小(你可能需要更多的课，我只是选择最常见的大小)。
在用于较小设备的媒体查询CSS中，这些相同的类简单地重新表述如下：
.video640 {width: 230px; height: 197px}
.video560 {width: 230px; height: 170px}
.video480 {width: 240px; height: 193px}
我欣赏这需要一些标记“前期”，当包括视频在你的HTML(即添加一个类)，但如果你不想下去的Javascript路由，这是很好 – 根据您的需要，为您的视频课程提供多种不同的大小。以下是Youtube标记的外观：
<object class="video640" type="application/x-shockwave-flash" value="YOUTUBE URL"> <param name="movie" value="YOUTUBE URL"></param> </object>
