CSS变量名称中允许使用句点吗? [英] Are periods allowed in CSS variable names?

问题描述

例如我可以有一个像这样的css变量:-Button.onHover ?

For example could I have a css variable named like this: --Button.onHover?

请注意，CSS变量与CSS选择器不同(我必须解释一下，因为有人将其标记为重复).这是来自模块 superfly-css-variables-colors :

Note that CSS variables are different from CSS selectors (I have to explain this because someone marked this as a duplicate). Here's an example from the module superfly-css-variables-colors:

      :root {
        --percentage-lightest:  91%;
        --percentage-lighter:   78%;
        --percentage-light:     65%;
        --percentage-median:    52%;
        --percentage-dark:      39%;
        --percentage-darker:    26%;
        --percentage-darkest:   13%;

        --percentage-low: 25%;
        --percentage-high:  50%;

        --percentage-link-hover: 25%;
      }

推荐答案

在CSS中，属性名称是ident，并且ident不能包含句点.它们只能包含字母，数字，连字符减号和下划线..因此，属性名称不能包含句点， custom 属性名称也不能包含句点.

In CSS, property names are idents, and idents cannot contain a period. They may only contain letters, numerals, the hyphen-minus and the underscore. So it follows that property names cannot contain a period, and neither can custom property names.

因此，-Button.onHover 不是有效的自定义属性名称(或"CSS变量"名称，或任何您想调用的名称).

Therefore, --Button.onHover is not a valid custom property name (or "CSS variable" name, or whatever you want to call it).

这篇关于CSS变量名称中允许使用句点吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！