内容模糊外观

把元素自己的内容画成模糊的，让它退到视觉后面或遮住细节。

示例

Webfilter原生支持点选数值，样本实时变化

filter: blur(0);

Web原生支持

平台通用范围

也叫 blur() · filter

CSS: filter: blur()

官方定义是「对输入图像应用高斯模糊」。半径参数的含义写得很明确：它「定义高斯函数的标准差，也就是屏幕上有多少像素相互混合」。注意它作用于元素自身内容；要模糊元素背后的东西是另一个属性。

iOS原生支持

平台通用范围

也叫 blur(radius:opaque:)

SwiftUI: View.blur(radius:opaque:)

官方描述是「对这个视图应用高斯模糊」。多一个 opaque 参数，官方说明是「指示模糊渲染器是否允许模糊输出中存在透明度」—— 另两端没有这个开关。半径的说法是「模糊的径向尺寸」，未提标准差。

Android原生支持

Android 12 及以上；更低版本调用会被忽略

也叫 Modifier.blur

Compose: Modifier.blur(radius, edgeTreatment)

官方描述是「把内容按指定半径画成模糊」，并紧接着写明版本限制：「此效果仅在 Android 12 及以上支持。在更低版本上使用这个修饰符的尝试会被忽略」—— 是静默忽略，不是报错。官方还提醒模糊层会被裁到内容边界，建议在内容四周按模糊半径预留空间，否则边缘会被切掉。

内容模糊让内容变得看不清，不透明度让内容变得看得见但淡。

这条词条还没有经过验证的实现提示词。