css + html：相对百分比？ （mediaqueries）

Question

嘿伙计们， 奇怪的情况，我不知道如何解决这个问题。

我正在尝试使用媒体查询的响应式网站。嵌入式YouTube视频也会响应布局，因此我尝试将每个视频的内容设置为100％并按比例计算其高度！

结果如下：

<p class="youtube-vid">
<object width="100%" height="61%">
<param name="movie" value="http://www.youtube.com/v/rBa5qp9sUOY?version=3">
<param name="allowFullScreen" value="true">
<param name="allowscriptaccess" value="always">
<embed src="http://www.youtube.com/v/rBa5qp9sUOY?version=3" type="application/x-shockwave-flash" width="100%" height="61%" allowscriptaccess="always" allowfullscreen="true">
</object>
</p>

因此，当从youtube嵌入它时，此视频最初为500像素×306像素。

问题是这件事可能确实有效，但我不知道百分比在哪里提到。 100％的宽度是完全正确和依赖我的布局61％的高度是不正确的。 61％是正确的数字，但它看起来不对，因为它可能是某些外部容器的61％或其他东西。

知道如何解决这个问题。我只是希望我的视频100％合适（现在是正确的 - 即使调整大小时）和比例高度取决于视频的原始值？

Answer 1

height和width是单独计算的，与原始宽高比无关。只需设置height="100%"和width即可。我知道这适用于图像以保持纵横比，但我不确定它是否适用于对象。