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
: before - Creaters A pseudo-element that is the first child of the selected element. it is inline
by default.
: after - Creaters a pseudo-element that is the last child of the selected element. It is inline
by default.
:: first-letter - Applies styles to the first letter of the first line of a block-level element.
:: first-line - Applies styles to the first line of a block-level element.
:: placeholder - Represents the placeholder text in an <input> or <textarea> element.
:: file-selector-button - Represents the button of an <input> of type="file".
:: 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 ).
:: 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
CSS Pseudo Elements.pdf

CSS Pseudo Elements.pdf

  • 1.
    CSS Pseudo Elements. ACSS 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