param(): 把 CSS 变量传进被引用的图片里
本系列前面讲的函数都是「把输入算成一个值」。param() 不一样——它不计算，而是在引用一张图片的地方（<img> 的 URL、background-image 的 url()、或新属性
link-parameters）往那张图塞进一个具名参数。图片内部（通常是 SVG）再用 env() 把它接出来，于是同一份资源能被调用方动态换色 / 换参，无需为每种主题各导出一份。出处：CSS Linked Parameters。
它要解决的痛点： 用 <img src> 或 background-image: url() 引入的外部 SVG 是一个隔离的沙箱——外层页面的 var(--brand) / color 进不去,SVG 内部的图形也选不中（详见
svg 系列的嵌入矩阵）。要换个颜色，过去只能复制多份 SVG、或改用 inline <svg>。param() 想给这道隔离墙开一扇单向的具名传参口：调用方递进去名值，资源内部 env() 接住。
方向是反过来的两个函数。 param(--color, green) 写在外面（引用处），把名为 --color 的参数送进资源；env(--color, black) 写在里面（被引用的 SVG），把这个参数取出、没传到时退回
black。这正是 env() 的扩展用法——它本来读的是 UA 环境变量（如 safe-area-inset-*），这里读的是调用方注入的自定义参数。和 var() 的区别：var() 只在同一文档内代换，跨不过资源边界；param()
专为跨资源而设。
1 · 一份资源，随调用方染色
下面左右是同一个 star.svg：它的填充写成 fill="env(--brand, …)" 等三处可注入点。左卡是不传任何 param() 时的样子（全部走 env() 的
fallback）；右卡是把下面三个参数传进去后的样子。拖调色板，只有右卡跟着变——资源文件一个字没动。语法骨架、三种等价的调用写法、以及被引用资源内部的接收写法都放在下面的面板里，右卡的调用代码随取色实时更新。
被引用资源内部怎么接。 每个图形各写一遍 env(--x, fallback) 即可；若一个参数要在多处复用，可在 SVG 自己的样式里先存进一个自定义属性，后面统一用 var()（上面面板末段即此写法）。
2 · 和「能进 SVG 的」其他手段比一比
给 SVG 换色的办法不止一种，但它们能作用的嵌入方式差别很大。关键分界线是：图形有没有进入当前文档的 DOM。currentColor / var() 只对 inline <svg> 与同文档 <use> 有效；一旦换成 <img> 或
background-image，就只剩「复制多份文件」或 param() 这条（尚在提案的）路。
现状提醒： param() / link-parameters 出自 CSS Linked Parameters，处于早期草案阶段，目前没有任何浏览器实现。本页两块预览全程由 JS 模拟
env() 的代换（把 env(--x, fb) 按当前参数替换后再渲染），用来说明语义，不代表真实浏览器行为。检测方式是运行期探针 CSS.supports('link-parameters', 'param(--x, red)')，而非猜版本号。草案里若干细节（尤其 url() 内 param
的分隔符、多参数的连接符）仍在演进，以规范最新文本为准。
3 · 🔗 相关链接
- CSS Linked Parameters Module Level 1 · drafts.csswg.org——本页主要来源：
param()的三处用法（URL 片段 /link-parameters/url()）、资源内env()接收与 fallback 语义、规范示例。 - env() · developer.mozilla.org——
env()的现有形态（读safe-area-inset-*等 UA 环境变量）与 fallback 写法——param()复用的就是这套接收端。 - svg 系列 · 嵌入矩阵 · 本站——逐格实测「哪种嵌入方式能被外部 CSS 管到」：
<img>/background/<object>为何隔离——param()要解决的正是这张表里那几个 ❌。