CSS 数据类型 <ident> 表示用作标识符的任意字符串。
语法
数据类型 <custom-ident> 的语法与 CSS 标识符类似,例如属性名称。唯一的区别是它区分大小写。它可以包含一个或多个字符,其中字符可以是以下字符之一:
任何字母字符(A 到 Z 或 a 到 z),
任何十进制数字(0 到 9),
连字符 (-),
下划线 (_),
转义字符(前面有反斜杠 \),
反斜杠 (\) 格式的 Unicode 字符,后跟一到六位十六进制数字。它代表 Unicode 代码点。
注意:由于 <custom-ident> 的语法区分大小写,因此标识符如 ID1 、id1、Id1 和 iD1 都是不同的标识符。
/* 有效标识符 */
test1 /* 字母数字字符和数字的混合 */
test-sample /* 字母数字字符和带有连字符 (-) 的数字的混合 */
-test1 /* 破折号/连字符后跟字母数字字符 */
--test1 /* 自定义属性,如标识符 */
_test1 /* 下划线后跟字母数字字符 */
\11 test /* 一个 Unicode 字符,后跟一系列字母数字字符 */
test\.sample /* 正确转义的句点 */
/* 无效的标识符 */
25rem /* 不能以小数开头 */
-25rem /* 不得以破折号/连字符开头,后跟十进制数字 */
test.sample /* 只有字母数字字符、_ 和 - 不需要转义 */
'test1' /* 不允许使用字符串 */
"test1" /* 不允许使用任何字符串 */
CSS <ident>: 用作变量的自定义标识符
以下示例演示了如何使用 <ident> 数据类型来声明一个变量并在 css 样式中使用它:
<html>
<head>
<style>
:root {
--body-background-color: peachpuff;
}
div {
background-color: var(--body-background-color);
width: 300px;
height: 300px;
border: 3px solid black;
}
</style>
</head>
<body>
<h1>custom-ident - example</h1>
<div></div>
</body>
</html>
在上面的示例中,使用数据类型 <custom-ident> 声明了一个自定义属性,名为 --body-background-color 来设置颜色div 元素。这里的语法使用两个破折号来开头名称,后跟字母字符和连字符。