aspect-ratio
通过 aspect-ratio 属性来设置元素的宽高比。
文档
developer.mozilla.org/zh-CN/docs/…
语法
aspect-ratio: <width> / <height>;
示例
HTML
<div class="card card-1-1">1:1</div>
<div class="card card-16-9">16:9</div>
CSS
.card {
display: flex;
justify-content: center;
align-items: center;
height: 90px;
}
.card-1-1 {
aspect-ratio: 1 / 1;
}
.card-16-9 {
aspect-ratio: 16 / 9;
}
