Pseudo Selectors

Pseudo Selectors

All About Pseudo Class and Element Selectors

#Pseudo Class

A pseudo-class is used to define a special state of an element.

For example, it can be used to:

  • Style an element when a user mouses over it

  • Style visited and unvisited links differently

  • Style an element when it gets focus

  1. Hover Pseudo Class selector:-when we point (cursor) on the element then it matches with the result,
  1. Focus Pseudo Class selector:- When we want to give all the attention to a particular content or element then we use this focus.

    eg:- while setting name and password the bg colour should be sky blue.

  2. Link Pseudo Class selector:- by using this we can target particular link to give it specification/style

  3. Visited Pseudo Class selector:-by using this selector we can denote weather the visitor has visited this site earlier or not, so it will be very easy for the user to know which site he has already gone to.

#Pseudo element

A CSS pseudo-element is a keyword added to a selector that lets you style a specific part of the selected element(s).

For example, ::first-line can be used to change the font of the first line of a paragraph.

  1. After pseudo-element selector:- it is used to add content after the element.

    It is often used to add cosmetic content to an element with the content property. It is inline by default.

  2. After pseudo-element selector:- it is used to add content before the element.

    It is often used to add cosmetic content to an element with the content property. It is inline by default.

Hitesh Choudhary Anurag Tiwari

#iwritecode

thank you very much for reading