UTILS.
默认保护隐私
▭

CSS 宽高比容器

生成带 padding 回退方案的响应式宽高比容器。

文件始终留在此设备上

文件在浏览器中处理,绝不上传。网站会下载运行工具所需的代码和资源。无需账号,也无追踪。

使用“下载”将此工具保存为单个 HTML 文件,以便离线使用。

隐私 →

关于此工具

在浏览器中输入宽高比例即可生成响应式的宽高比容器,同时提供现代 aspect-ratio CSS 和 padding-top 百分比回退方案。

常见问题

为什么要包含 padding-top 回退方案?
padding-top 百分比技巧可以在不支持现代 aspect-ratio 属性的旧版浏览器中重现固定的宽高比。
比例会被化简吗?
会——像 16 和 9 这样的数值会按最大公约数约分,因此 1920 比 1080 会显示为 16 / 9。

更多工具