比例计算器

什么是比例计算器？

比例计算器是一款用于计算和验证数学比例关系的在线工具。比例（ratio）是两个数之间的比较关系，在数学、设计、摄影、工程等领域中无处不在。在前端开发中，比例计算尤为重要：响应式设计中的宽高比（16:9、4:3）、黄金比例布局（1:1.618）、栅格系统中的列间距比例、图片裁剪的纵横比等。本工具支持以下计算：已知比例和部分值求未知值（如 3:5 = x:20，求 x）、比例化简（如 12:8 → 3:2）、比例验证（判断两组数是否成比例）、以及多个数的比例分配（如按 2:3:5 分配 100）。工具实时显示计算过程和结果，帮助开发者和设计师快速完成各种比例相关的计算。

如何使用比例计算器

1. 步骤一：选择计算模式 — 支持四种模式：求比例未知值（交叉相乘）、比例化简（最大公约数）、比例分配（按给定比例分割总量）、比例验证（检查等式是否成立）。
2. 步骤二：输入已知数据 — 在对应字段中输入已知的数值。例如"求未知值"模式下，输入 A:B = C:D 中已知的三个值，未知值留空。
3. 步骤三：查看结果 — 工具即时显示计算结果和过程。例如化简 24:36 会显示 GCD(24,36)=12，结果为 2:3。比例分配会显示每个部分的具体数值和百分比。

常见使用场景

技术原理

比例计算的核心数学原理是交叉相乘和最大公约数（GCD）。判断 A:B = C:D 是否成立，验证 A×D = B×C。求比例中的未知值：已知 A:B = C:x，则 x = B×C/A。化简比例使用欧几里得算法求 GCD：gcd(a,b)，然后将两个数都除以 GCD。比例分配：按 a:b:c 分配总量 S，各部分分别为 S×a/(a+b+c)、S×b/(a+b+c)、S×c/(a+b+c)。

// 最大公约数（欧几里得算法）
function gcd(a, b) { return b === 0 ? a : gcd(b, a % b); }

// 比例化简
function simplifyRatio(a, b) {
  const d = gcd(a, b);
  return [a/d, b/d];
}

// 按比例分配总量
function distribute(total, ...ratios) {
  const sum = ratios.reduce((a, b) => a + b, 0);
  return ratios.map(r => total * r / sum);
}

// 示例
simplifyRatio(24, 36);      // [2, 3]
distribute(100, 2, 3, 5);   // [20, 30, 50]

最佳实践与注意事项

• 在 CSS 中使用 aspect-ratio 属性设置元素宽高比（如 aspect-ratio: 16/9），比计算具体像素值更优雅且自动响应式。
• 比例化简时确保输入为正整数，小数比例需先乘以 10 的幂次转为整数再化简。
• 比例分配结果可能有浮点精度问题，金额场景建议对最后一项用总量减去其他项之和。
• 设计中使用黄金比例时，记住近似值 1:1.618 或斐波那契数列（1,1,2,3,5,8,13,21...）相邻项之比。

常见问题