#aspect-ratio

#介绍

设置元件宽高比，即 width / height。

#使用示例

css-apisrc/aspect-ratio/App.tsx

Code

预览

#语法

aspect-ratio: 1 / 1;
aspect-ratio: 16 / 9;
aspect-ratio: 0.5;

#取值

#<ratio>

默认为无宽高比。盒子的宽高比为指定的 width / height 比率。如果省略 height 和前面的斜杠字符，则 height 默认为 1。涉及宽高比的尺寸计算使用由 box-sizing 所指定的盒子的尺寸。

#形式定义

#形式语法

aspect-ratio = <number [0,∞]> [ / <number [0,∞]> ]

#与 Web 的区别

mdn: aspect-ratio

1. 不支持 auto，默认为无宽高比。

#兼容性