javascript - 如何为 16 :9 aspect ratio in portrait mode for Ionic 2 设置高度 div css

Question

假设我有一个位于 ion-content 之上的 div。我试图通过获取设备的宽度来设置 div 的高度并计算它，以便纵横比为 16:9 就像 youtube 应用程序一样。但是，我不知道如何使用 css 来实现它。现在，这就是我所拥有的。

div {
    width: auto;
    max-height: 40%; <-- how to set this height so that it is 16:9 
    background: black;

div.img {
    width: 360px;
    max-height: 202.5px;
}

我想要的:

Answer 1

你只需要使用这个简单的CSS样式

56.25% = 16:9 纵横比

.img {
    width: 100%;
    height: 56.25vw;
}