背景色外观
铺在元素内容后面的那一层颜色，用来把这块区域和周围分开。
- 把底色换掉
- 后面那层颜色
- 块的颜色
- 背景色
- 底色
- 填充色
示例
background-color: #3FCF8E;
Web / iOS / Android 对照
Web原生支持
平台通用范围
background-color
CSS: background-color
与 background 简写不同：background 还包含背景图、位置、重复等，这条只管颜色那一层。
iOS原生支持
平台通用范围
background
SwiftUI: .background(_:)
官方描述是「把视图的背景设置为某个 style」——style 可以是颜色，也可以是渐变或材质。
Android原生支持
平台通用范围
background
Compose: Modifier.background
官方描述是「在内容后面以纯色绘制 shape」。
使用规范
什么时候用
- 需要区分区域层级时
- 需要表达选中或悬停状态时
什么时候别用
- 要让整个元素连内容一起变淡时——那是不透明度
- 仅靠颜色传达信息、不给第二重线索时
容易混淆
跨端框架实现
- Flutter
BoxDecoration.colorContainer(decoration: BoxDecoration(color: …))
给 AI 的提示词
这条词条还没有经过验证的实现提示词。