2.5 KiB
selector-pseudo-element-colon-notation
Specify single or double colon notation for applicable pseudo-elements.
::before {}
a/** ↑
* This notation */
The ::
notation was chosen for pseudo-elements
to establish a discrimination between pseudo-classes (which
subclass existing elements) and pseudo-elements (which are
elements not represented in the document tree).
However, for compatibility with existing style sheets, user agents
also accept the previous one-colon notation for pseudo-elements
introduced in CSS levels 1 and 2 (namely, :first-line
,
:first-letter
, :before
and
:after
).
The fix
option can automatically fix all of the problems reported by this
rule.
Options
string
: "single"|"double"
"single"
Applicable pseudo-elements must always use the single colon notation.
The following patterns are considered violations:
::before { color: pink; } a
::after { color: pink; } a
::first-letter { color: pink; } a
::first-line { color: pink; } a
The following patterns are not considered violations:
:before { color: pink; } a
:after { color: pink; } a
:first-letter { color: pink; } a
:first-line { color: pink; } a
::placeholder { color: pink; } input
::marker { font-variant-numeric: tabular-nums; } li
"double"
Applicable pseudo-elements must always use the double colon notation.
The following patterns are considered violations:
:before { color: pink; } a
:after { color: pink; } a
:first-letter { color: pink; } a
:first-line { color: pink; } a
The following patterns are not considered violations:
::before { color: pink; } a
::after { color: pink; } a
::first-letter { color: pink; } a
::first-line { color: pink; } a
::placeholder { color: pink; } input
::marker { font-variant-numeric: tabular-nums; } li