我可以在CSS类名中使用camel-case吗

时间:2021-05-26 20:30:29

I want to name a CSS class and call it imgSuper. Can I use camel-casing in CSS classes?

我想命名一个CSS类,并将其命名为imgSuper。我可以在CSS类中使用驼背吗?

4 个解决方案

#1


38  

Technically yes, but it's risky because while CSS syntax is mostly case-insensitive, in some browsers under certain conditions, class names are treated as case-sensitive, as the spec does not specify how browsers should handle case when matching CSS rules to HTML class names.

技术上是这样的,但这是有风险的,因为虽然CSS语法大多不区分大小写,但在某些条件下,类名被视为大小写敏感的,因为规范没有指定浏览器在将CSS规则与HTML类名匹配时应该如何处理大小写。

From the spec, section 4.1.3:

规范第4.1.3节:

All CSS syntax is case-insensitive within the ASCII range...

所有CSS语法在ASCII范围内是不区分大小写的……

In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A1 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, or a hyphen followed by a digit. Identifiers can also contain escaped characters and any ISO 10646 character as a numeric code (see next item). For instance, the identifier "B&W?" may be written as "B\&W\?" or "B\26 W\3F".

在CSS中,标识符(包括选择符中的元素名、类和id)只能包含字符[a-zA-Z0-9]和ISO 10646字符U+00A1及以上,加上连字符(-)和下划线(_);它们不能以数字开头,也不能以连字符后跟数字。标识符还可以包含转义字符和任何ISO 10646字符作为数字代码(参见下一项)。例如,标识符“B&W?”可以写成“B\&W\?”或“B\26 W\3F”。

...the case-sensitivity of values of the HTML attributes "id" and "class", of font names, and of URIs lies outside the scope of this specification.

…HTML属性“id”和“类”、字体名称和uri的大小写敏感性不在本规范的范围之内。

Rather than learn the browsers and conditions where case is sensitive, it's best that you just realize that the best approach is the most compatible: use the same case in all code for a given CSS class, and don't create two or more CSS class names that differ only in case.

而不是学习的浏览器和条件很敏感,最好您刚刚意识到,最好的方法是最兼容:使用相同的情况下在所有代码对于给定的CSS类,不要创建两个或多个CSS类名不同情况。

#2


6  

Sure. Here are the official rules; basically you shouldn't start the name with a number, and you can use letters, numbers, hyphen, underscore, and escaped or encoded characters.

确定。以下是官方规定;基本上你不应该以数字开头,你可以使用字母、数字、连字符、下划线、转义字符或编码字符。

However, as a matter of convention, hyphens are generally used instead of camel case.

然而,按照惯例,连字符通常被用来代替驼色。

#3


1  

Yes, class names are case sensitive, so that works fine.

是的,类名是区分大小写的,所以这样做很好。

However, you should be aware that some browsers get this wrong, and don't treat class names as case sensitive. Therefore you should avoid using both the upper and lower case variations of the same name. The classes imgSuper and imgsuper may be treated as the same by some browsers.

但是,您应该注意到,有些浏览器会出错,并且不会将类名视为区分大小写。因此,您应该避免使用相同名称的大小写变体。某些浏览器可能会将imgSuper和imgSuper类视为相同的类。

#4


0  

Yes you can. Just be sure that if you call a class "fooBar" in your css file that you use consistent caps when assigning class="fooBar" in your markup.

是的,你可以。请确保在您的css文件中调用一个类“fooBar”,在您的标记中指定class=“fooBar”时使用一致的大写。

#1


38  

Technically yes, but it's risky because while CSS syntax is mostly case-insensitive, in some browsers under certain conditions, class names are treated as case-sensitive, as the spec does not specify how browsers should handle case when matching CSS rules to HTML class names.

技术上是这样的,但这是有风险的,因为虽然CSS语法大多不区分大小写,但在某些条件下,类名被视为大小写敏感的,因为规范没有指定浏览器在将CSS规则与HTML类名匹配时应该如何处理大小写。

From the spec, section 4.1.3:

规范第4.1.3节:

All CSS syntax is case-insensitive within the ASCII range...

所有CSS语法在ASCII范围内是不区分大小写的……

In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A1 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, or a hyphen followed by a digit. Identifiers can also contain escaped characters and any ISO 10646 character as a numeric code (see next item). For instance, the identifier "B&W?" may be written as "B\&W\?" or "B\26 W\3F".

在CSS中,标识符(包括选择符中的元素名、类和id)只能包含字符[a-zA-Z0-9]和ISO 10646字符U+00A1及以上,加上连字符(-)和下划线(_);它们不能以数字开头,也不能以连字符后跟数字。标识符还可以包含转义字符和任何ISO 10646字符作为数字代码(参见下一项)。例如,标识符“B&W?”可以写成“B\&W\?”或“B\26 W\3F”。

...the case-sensitivity of values of the HTML attributes "id" and "class", of font names, and of URIs lies outside the scope of this specification.

…HTML属性“id”和“类”、字体名称和uri的大小写敏感性不在本规范的范围之内。

Rather than learn the browsers and conditions where case is sensitive, it's best that you just realize that the best approach is the most compatible: use the same case in all code for a given CSS class, and don't create two or more CSS class names that differ only in case.

而不是学习的浏览器和条件很敏感,最好您刚刚意识到,最好的方法是最兼容:使用相同的情况下在所有代码对于给定的CSS类,不要创建两个或多个CSS类名不同情况。

#2


6  

Sure. Here are the official rules; basically you shouldn't start the name with a number, and you can use letters, numbers, hyphen, underscore, and escaped or encoded characters.

确定。以下是官方规定;基本上你不应该以数字开头,你可以使用字母、数字、连字符、下划线、转义字符或编码字符。

However, as a matter of convention, hyphens are generally used instead of camel case.

然而,按照惯例,连字符通常被用来代替驼色。

#3


1  

Yes, class names are case sensitive, so that works fine.

是的,类名是区分大小写的,所以这样做很好。

However, you should be aware that some browsers get this wrong, and don't treat class names as case sensitive. Therefore you should avoid using both the upper and lower case variations of the same name. The classes imgSuper and imgsuper may be treated as the same by some browsers.

但是,您应该注意到,有些浏览器会出错,并且不会将类名视为区分大小写。因此,您应该避免使用相同名称的大小写变体。某些浏览器可能会将imgSuper和imgSuper类视为相同的类。

#4


0  

Yes you can. Just be sure that if you call a class "fooBar" in your css file that you use consistent caps when assigning class="fooBar" in your markup.

是的,你可以。请确保在您的css文件中调用一个类“fooBar”,在您的标记中指定class=“fooBar”时使用一致的大写。