rgb()函数严格要求且仅接受三个参数，支持0–255整数或0%–100%百分比（不可混用），超出范围值被静默截断；需透明度必须用rgba()，alpha限0–1小数；动态生成时应预先校验数值。
rgb() 函数只接受三个参数，多一个或少一个都会失效
浏览器对 rgb() 的参数数量极其严格：必须且仅能传入红、绿、蓝三个值。写成 rgb(255, 0, 0, 0.5) 或 rgb(255, 0)，整条声明会被直接丢弃，元素颜色回退到继承值或默认色（通常是黑色），**不报错、不警告、也不在开发者工具中显示为“已禁用”**——这最容易让人误以为 CSS 没生效。
需要透明度？必须换用 rgba()，第四个参数是 alpha 值（0–1 小数），不是百分比，也不是整数。
-
rgba(255, 0, 0, 0.5)✅ 正确 -
rgba(255, 0, 0, 50%)❌ 无效（alpha 不支持 %） -
rgba(255, 0, 0, 50)❌ 无效（alpha 超出 0–1 范围）
数值不能带单位，也不能是小数或百分比混用
rgb() 的每个参数只接受两种合法形式：0–255 的整数，或 0%–100% 的百分比。但二者不可混用，且严禁加单位（如 px、em）或小数。
常见失效写法：
-
rgb(255px, 0, 0)—— 单位导致整条声明被忽略 -
rgb(255.5, 0, 0)—— 小数不被接受，截断逻辑不触发，直接失效 -
rgb(100%, 128, 0)—— 百分比和整数混用，整个函数无效
合法写法只有：rgb(255, 0, 0) 或 rgb(100%, 0%, 0%)。后者语义清晰，但 IE8 及更早版本不支持，若需兼容旧环境，优先用整数形式。
超出范围的值会被静默截断，调试时容易误判
rgb(300, -20, 270) 不会报错，浏览器会自动把每个通道 clamp 到 [0, 255] 区间：等价于 rgb(255, 0, 255)。这种静默处理在动态生成颜色（比如 JS 计算亮度偏移）时尤其危险——你以为数值溢出了，实际只是被截了，而控制台和样式面板都看不出异常。
建议在 JS 动态构造 rgb 字符串前做校验：
function clamp(n) { return Math.max(0, Math.min(255, Math.round(n))); }
const r = clamp(userInputR);
const g = clamp(userInputG);
const b = clamp(userInputB);
element.style.color = `rgb(${r}, ${g}, ${b})`;
rgb() 和十六进制不是“性能替代”，选哪个取决于使用场景
rgb(255, 0, 0) 和 #ff0000 渲染效果完全一致，但适用场景不同：
- 需要 JS 动态调整某通道（比如根据数据改变红色强度）→ 用
rgb()，避免字符串解析与十六进制转换 - 纯静态配色、追求最小体积、兼容性兜底 →
#f00或#ff0000更稳妥 - 团队协作中强调色彩构成逻辑（如“提高绿色占比”）→
rgb()可读性更高
压缩工具（如 CSSNano）通常不会把 rgb(255, 0, 0) 自动转成 #f00，所以手写时若无动态需求，别为了“看起来现代”硬套 rgb()。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
