Can Leading Numbers in CSS Class Names Be Validated?

Invalid CSS Class Names with Leading Numbers: A Workaround

Although HTML allows class names that begin with numbers, such as ".000000-8," browsers often display issues with these classes. However, there exists a workaround to validate CSS classes with leading numbers.

Escaping the Digit

According to CSS syntax, CSS identifiers cannot commence with an unescaped digit. However, this limitation can be bypassed by escaping the digit.

Syntax for Escaping Digits

To escape a digit, use the following format:

.\<octal_number>

Here, represents the octal representation of the digit.

Example

To escape the digit "0" in the class name ".000000-8," use the following selector:

. 00000-8

Simplified Escaping

Alternatively, you can simplify the escaping by representing the octal number as a zero-padded decimal string:

.003000000-8

Both of these selectors will match an element with the class name "000000-8."

Caution

While this workaround allows you to use class names with leading numbers, it is generally recommended to avoid such names. They can lead to compatibility issues and make CSS selectors harder to read and maintain.

The above is the detailed content of Can Leading Numbers in CSS Class Names Be Validated?. For more information, please follow other related articles on the PHP Chinese website!