CSS Pseudo Elements.pdf
0 likes156 views
CSS pseudo-elements allow styling specific parts of selected elements, such as the first letter or line. Common pseudo-elements include ::first-letter, ::first-line, ::placeholder, and ::after, among others, each serving unique functions. The document also touches on various CSS knowledge essentials and resources for developers.
CSS Pseudo Elements.pdf
- 1. CSS Pseudo Elements. A CSS Pseudo element is a keyword added to a selector that lets you style a specific part of the selected elements. For Example, it can be used to: ● Style the first letter, or line, of an element ● inserts content before, or after, the content of an element Syntax You can use only one pseudo-element in a selector. it must appear after the simple selectors in the statement. Instagram - @the_coding_ @happy_coding_life
- 2. : before - Creaters A pseudo-element that is the first child of the selected element. it is inline by default.
- 3. : after - Creaters a pseudo-element that is the last child of the selected element. It is inline by default.
- 4. :: first-letter - Applies styles to the first letter of the first line of a block-level element.
- 5. :: first-line - Applies styles to the first line of a block-level element.
- 6. :: placeholder - Represents the placeholder text in an <input> or <textarea> element.
- 7. :: file-selector-button - Represents the button of an <input> of type="file".
- 8. :: maker - Selects the marker box of a list item, which contains a bullet or number. :: selection - Applies style to the part of a document that has been highlighted by the user ( such as clicking and dragging ).
- 9. :: cue - Matches WebVTT cues within a selected element. This can be used to style captions and other cues. This can be used to style captions and other cues in media with VTT tracks. :: backdrop - Creators a backdrop that covers the entire viewport and is rendered immediately below a <dialog> or ant element that enters fullscreen mode using the full-screen API. :: part() - Represents any element within a shadow tree that has a matching part attribute. ● Minimum CSS Every Developer Must Know ● Want to Improve Your Problem-solving skills? ● 5 Automations For Developers Out There. ● Programming Skill Student Should Know ● How You center a Div ● 8 Great React Books For Beginners ● 7 APIs Frontend Developers Should Know ● Free IIIT Madras Free Courses With Certificate With Also Free Goodies and Prizes 2022