CSS 变量/自定义属性
CSS 变量的缺点:
- 不能被探测
- 总是继承 // houdini 解决
- 不能动画 // houdini 解决
只要名字合法,@supports 总是 ture
--theme-color: 73, 188, 133; // 表示有三个数字的 css 值
color: rgba(var(--theme-color),.5); // 和其他数字连接成
--theme-color: #ffffff;
color: var(--theme-color)66; // 字符串链接成字符串而不是
应用未设置的自定义属性视为无效值 // 不会验证,所以也能覆盖属性
配置一个基础主题,是否可以使用算法来计算出不同情况下的主题?
- 主色变化/系统色
- 深色/浅色主题
- 环境光/亮度