CSS <ident> Data Type
The CSS <ident> data type represents an identifier, which is a sequence of characters used for CSS keywords, names, and other values. Identifiers are not enclosed in quotation marks and must follow CSS identifier syntax.
Syntax
An <ident> consists of one or more characters that form a valid CSS identifier. Identifiers can contain letters, digits, hyphens, underscores, non-ASCII characters, and escaped characters, subject to restrictions on how an identifier can begin.
example
main-content
_sidebar
section2
résumé
Unlike the <string> data type, an identifier is written without quotation marks.
Valid Identifiers
CSS identifiers can contain:
- ASCII letters from
AthroughZandathroughz. - Digits from
0through9, except where restricted at the beginning of an identifier. - Hyphens (
-). - Underscores (
_). - Non-ASCII characters.
- Characters represented using CSS escape sequences.
header
main-content
_sidebar
section2
example_name
Starting Characters
An identifier cannot begin with an unescaped digit. It also cannot begin with a hyphen immediately followed by an unescaped digit. Characters that would otherwise make the identifier invalid can be represented using an escape sequence.
| Value | Result |
|---|---|
example |
Valid identifier |
example2 |
Valid identifier |
2example |
Not a valid identifier without escaping the initial digit |
-2example |
Not a valid identifier without escaping the digit |
Escape Sequences
CSS escape sequences allow characters that would otherwise have a special meaning or be invalid at a particular position to be included in an identifier. A backslash begins the escape sequence.
my\ identifier
\32 example
In the second example, \32 represents the character 2. The space terminates the hexadecimal escape and is not part of the resulting identifier.
Case Sensitivity
Whether identifiers are case-sensitive depends on the context in which they are used. CSS-defined keywords are generally ASCII case-insensitive, while author-defined identifiers may be case-sensitive depending on the CSS feature that defines them.
For this reason, the rules of the property, function, selector, or other CSS feature using the identifier determine whether differences in letter case are significant.
<ident> Examples
Identifiers appear throughout CSS as keywords and names. The following examples contain identifier values in several different contexts:
.example {
display: block;
position: relative;
animation-name: fade-in;
}
@keyframes fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
Values such as block, relative, fade-in, from, and to use identifier syntax, although individual CSS grammars determine which identifiers are permitted in each context.
Specifications
The <ident> data type is defined in the CSS Values and Units Module Level 4 .
