<dashed-ident>

**<dashed-ident>** CSS 数据类型 表示用作 标识符 的任意字符串。

语法

<dashed-ident> 的语法类似于 CSS 标识符(例如属性名),但它 区分大小写。它以两个连字符开头,后面跟着用户定义的标识符。

开头处的双连字符使它们在阅读 CSS 代码块时易于识别,并有助于避免与标准 CSS 关键字发生命名冲突。

就像 <custom-ident> 一样,<dashed-ident> 由用户定义,但与 <custom-ident> 不同,CSS 永远不会定义 <dashed-ident>

示例

与 CSS 自定义属性一起使用

<dashed-ident>CSS 自定义属性 一起使用时,首先声明该属性,然后在 CSS var() 函数 中使用。

css
html {
  --primary-color: red;
  --secondary-color: blue;
  --tertiary-color: green;
}

h1,
h4 {
  color: var(--primary-color);
}

h2,
h5 {
  color: var(--secondary-color);
}

h3,
h6 {
  color: var(--tertiary-color);
}

与 @color-profile 一起使用

<dashed-ident>@color-profile at 规则一起使用时,首先声明 at 规则,然后在 CSS color() 函数 中使用。

css
@color-profile --my-color-profile {
  src: url("https://example.org/SWOP2006_Coated5v2.icc");
}

.header {
  background-color: color(--my-color-profile 0% 70% 20% 0%);
}

与 @font-palette-values 一起使用

<dashed-ident>@font-palette-values at 规则一起使用时,首先声明 at 规则,然后将其用作 font-palette 属性的值。

css
@font-palette-values --my-palette {
  font-family: Bixa;
  base-palette: 1;
  override-colors: 0 #ff0000;
}

h1,
h2,
h3,
h4 {
  font-palette: --my-palette;
}

规范

规范
CSS 值和单位模块 Level 4
# dashed-idents

浏览器兼容性

由于此类型不是真正的类型,而是一个简化其他 CSS 语法定义的便利类型,因此没有浏览器兼容性信息。

另请参见