March 1Mar 1 Administrators CSS Pseudo-elements Reference CSS Pseudo-elements A CSS pseudo-element is used to style specific parts of an element. For example, it can be used to: Style the first letter or line, of an element Insert content before or after an element Style the markers of list items Style the viewbox behind a dialog box The table below shows the different pseudo-elements in CSS: Pseudo-element Example Example description ::after p::afterdiv::after Inserts something after the content of the specified element ::backdrop dialog::backdrop Styles the viewbox behind a dialog box or popover element ::before p::beforediv::before Inserts something before the content of the specified element ::file-selector-button ::file-selector-button Selects any button of type <input type="file"> ::first-letter p::first-letter Selects the first letter of every <p> element ::first-line p::first-line Selects the first line of every <p> element ::grammar-error ::grammar-error Styles a text that the browser has flagged as grammatically incorrect ::highlight() ::highlight(custom-name) Selects a custom highlight ::marker ::marker Selects the markers of list items ::placeholder input::placeholdertextarea::placeholder Styles the placeholder text of <input> or <textarea> elements ::selection ::selection Styles the user-selected text ::spelling-error ::spelling-error Styles a text that the browser has flagged as incorrectly spelled ::view-transition ::view-transition Represents the root of the view transitions overlay, which contains all view transition on the page ::view-transition-group ::view-transition-group Represents a single view transition snapshot group ::view-transition-image-pair ::view-transition-image-pair Represents a container for a view transition's "old" and "new" view states - before and after the transition ::view-transition-new ::view-transition-new Represents the "new" view state of a view transition ::view-transition-old ::view-transition-old Represents the "old" view state of a view transition ★ +1 Sign in to track progress
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.