Pseudo Class

 

Style the first Or Last element of each of the lists differently.

• One way is to add class with each first LI with in required UL
• Let CSS automatically figure out which is the first-li element inside of a container.
  • By Adding a pseudo class with li element by using : sign
  • 
  •  

 

 

 

Target a specific child (2nd or 3rd Child)

• Say Want to style the 2nd child
  • 

 

 

 

Target All Odd / Even Childs

• Target all Even Childs
  • 
• Target all Old Childs
  • 

 

 

 

Target very first Paragraph Child inside the articles

• First element inside another element (Any element)
  • 

 

 

When we mix multiple elements inside of a parent element, then these pseudo-classes don't work really well.

 

 

 

Style Hyperlink Using Pseudo Class- 

• All Anchor tag irrespective of whether have href attribute or not
  • 
• Link State
  • target all the anchor elements that have an href attribute.
  • 
• Visited State : Visited Pseudo class
  • After clicking
  • 
• Hover State / Pseudo Class
  • As soon as the element is hovered by the mouse.
  • 
• Active State / Pseudo Class
  • This is the state in which we are actually clicking.
  •