Pseudo-elements
یک CSS pseudo-element کلمه کلیدی است که به انتخابگر اضافه میشود و اجازه میدهد قسمت خاصی از عنصر انتخاب شده را آرایش کنید. برای مثال، first-line::
میتواند برای تغییر نوشتار و رنگ خط اول یک پاراگراف مورد استفاده قرار گیرد.
/* The first line of every <p> element. */
p::first-line {
color: blue;
text-transform: uppercase;
}
Note: In contrast to pseudo-elements, pseudo-classes
(en-US) can be used to style an element based on its state.
Syntax
selector::pseudo-element { property: value; }
You can use only one pseudo-element in a selector. It must appear after the simple selectors in the statement.
Note: As a rule, double colons (::
) should be used instead of a single colon (:
). This distinguishes pseudo-classes from pseudo-elements. However, since this distinction was not present in older versions of the W3C spec, most browsers support both syntaxes for the original pseudo-elements.
Index of standard pseudo-elements
Browser | Lowest Version | Support of |
---|---|---|
Internet Explorer | 8.0 | :pseudo-element |
9.0 | :pseudo-element ::pseudo-element |
|
Firefox (Gecko) | 1.0 (1.0) | :pseudo-element |
1.0 (1.5) | :pseudo-element ::pseudo-element |
|
Opera | 4.0 | :pseudo-element |
7.0 | :pseudo-element ::pseudo-element |
|
Safari (WebKit) | 1.0 (85) | :pseudo-element ::pseudo-element |