syntax
语法
如下是所有的有效 syntax 字符串：
css
syntax: "<color>"; /* 接收一个颜色值 */
syntax: "<length> | <percentage>"; /* 接收长度或百分比参数，但是二者之间不进行计算合并 */
syntax: "small | medium | large"; /* 接收这些参数值之一作为自定义标识符 */
syntax: "*"; /* 任何有效字符 */
取值
规范定义的、受语法支持的字符串。支持的语法是CSS types的子集。这些可以单独使用，一些类型也可以结合使用。
"<length>"-
任何有效的
<length>值。 "<number>"-
任何有效的
<number>值。 "<percentage>"-
任何有效的
<percentage>值。 "<length-percentage>"-
任何有效的
<length-percentage>值。 "<color>"-
任何有效的
<color>值。 "<image>"-
任何有效的
<image>值。 "<url>"-
任何有效的
url()值。 "<integer>"-
任何有效的
<integer>值。 "<angle>"-
任何有效的
<angle>值。 "<time>"-
任何有效的
<time>值。 "<resolution>"-
任何有效的
<resolution>值。 "<transform-function>"-
任何有效的
<transform-function>值。 "<custom-ident>"-
任何有效的
<custom-ident>值。 "<transform-list>"-
A list of valid
<transform-function>值。
形式定义
形式语法
syntax =
<string>
实例
为 --my-color 自定义属性添加颜色值类型检测、设置默认值并且设置属性值不允许被继承。
css
@property --my-color {
syntax: "<color>";
inherits: false;
initial-value: #c0ffee;
}
使用 JavaScript 中的 CSS.registerProperty函数：
js
window.CSS.registerProperty({
name: "--my-color",
syntax: "<color>",
inherits: false,
initialValue: "#c0ffee",
});
规范
| 规范 |
|---|
| CSS Properties and Values API Level 1 # the-syntax-descriptor |