知识库 · 图片与文件
什么是宽高比？
简短回答
宽高比（画面比例）是图像宽度与高度之间的比例，用两个数字表示，例如 16:9 或 4:3。它描述的是形状而不是大小：1920 × 1080 和 1280 × 720 都是 16:9。缩放时要保持比例，新高度 = 新宽度 × 原高度 ÷ 原宽度；16:9 的图片宽 1200 像素时，高度就是 675 像素。
打开宽高比常见宽高比及用途
| 比例 | 小数 | 示例尺寸（像素） | 典型用途 |
|---|---|---|---|
| 1:1 | 1.00 | 1080 × 1080 | 方形社交帖子、头像 |
| 4:5 | 0.80 | 1080 × 1350 | 竖版社交信息流帖子 |
| 4:3 | 1.33 | 1600 × 1200 | 手机相机照片、老式电视、平板 |
| 3:2 | 1.50 | 6000 × 4000 | 单反和微单照片、6 寸（4 × 6 英寸）冲印 |
| 16:9 | 1.78 | 1920 × 1080 | 高清和 4K 视频、显示器、演示文稿 |
| 9:16 | 0.56 | 1080 × 1920 | 竖屏视频、快拍、短视频 |
| 21:9（宣传口径） | 约 2.37 | 2560 × 1080 | 带鱼屏（超宽）显示器 |
| 2.39:1 | 2.39 | 4096 × 1716 | 宽银幕电影 |
| 1:√2 | 0.71 | 2480 × 3508 | A4 等 ISO 纸张尺寸 |
16:9 通过 ITU-R BT.709 成为高清电视标准，该标准定义了 1920 × 1080 和 1280 × 720 两种画面。3:2 则来自 35 mm 胶片 36 × 24 mm 的画幅。
如何算出任意图片的比例
把宽度和高度分别除以它们的最大公约数（GCD）。
- 取像素尺寸，例如 1920 × 1080。
- 找出能同时整除两者的最大数：120。
- 相除：1920 ÷ 120 = 16，1080 ÷ 120 = 9，所以比例是 16:9。
有些尺寸只是近似于某个常见比例。1366 × 768 的笔记本屏幕约分后是 683:384，即 1.779，却按 16:9 销售。2560 × 1080 的「21:9」显示器准确来说是 64:27。比较小数（宽 ÷ 高）往往比比较分数更直观。
计算新尺寸而不变形
两边按同一系数缩放就能保持比例。以下两个公式覆盖所有情况：
new height = new width × original height ÷ original width（新高度 = 新宽度 × 原高度 ÷ 原宽度）new width = new height × original width ÷ original height（新宽度 = 新高度 × 原宽度 ÷ 原高度）
示例：一张 4032 × 3024 的照片（4:3）缩放到 1600 像素宽，高度为 1600 × 3024 ÷ 4032 = 1200 像素。一段 720 像素宽的 9:16 视频，高度为 720 × 16 ÷ 9 = 1280。
结果不是整数时，四舍五入到最近的像素。视频编码器通常要求尺寸为偶数，所以视频要取偶数。
改变比例：裁剪、填充还是拉伸
把 4:3 的照片变成 16:9 画面或 1:1 帖子，单靠缩放做不到，有三种选择：
| 方法 | 效果 | 适用场景 |
|---|---|---|
| 裁剪 | 裁掉图像的一部分 | 大多数照片；注意把主体留在画面内 |
| 填充（上下黑边或左右黑边） | 添加色条或模糊背景 | 内容一点都不能裁掉时，如文档或艺术作品 |
| 拉伸 | 宽和高按不同比例缩放 | 几乎不用；人脸和圆形会变形 |
把 4000 × 3000 的图片裁成 16:9，保留全部宽度，高度裁到 4000 × 9 ÷ 16 = 2250 像素，丢掉 25% 的画面。把同一张图裁成 1:1，则保留 3000 × 3000。
网页中的宽高比
CSS 有一个 aspect-ratio 属性，例如 aspect-ratio: 16 / 9，可以在图片或视频加载前预留出正确的空间。设置该属性，或者给图片加上 width 和 height 属性，可以防止媒体加载时页面跳动，从而改善累积布局偏移（CLS）分数。
常见问题
1920 × 1080 是什么比例？
16:9。两个数都能被 120 整除，得到 16 和 9。
4K 是 16:9 吗？
消费级 4K UHD 是 3840 × 2160，正好 16:9。电影 4K（DCI）是 4096 × 2160，约为 1.90:1。
手机拍的照片是什么比例？
大多数手机相机默认拍摄 4:3，例如 4032 × 3024。很多还提供 16:9 和 1:1 模式，是对传感器画面进行裁剪得到的。
改变宽高比会降低画质吗？
裁剪会去掉像素，但不会让其余部分变模糊。拉伸会让形状变形，大幅裁剪后再放大则会让图片发虚。