Pseudo-Classes

1.What is a pseudo-class? CSS pseudo-classes are special keywords added to selectors that let you style elements based on their state, position, or user interaction, without needing extra classes in your HTML. `Basic syntax: selector:pseudo-class { property: value; } Example: a:hover { color: red; }` This changes the link color only when the user hovers over it. 2.Why use pseudo-classes? They allow you to: Style elements dynamically (hover, click, focus) Target elements based on position (first, last, nth) Avoid adding extra classes in HTML Improve UI/UX interactions. 3.🔹 1. :hover (Hover Style) 👉 What it means: Applies styles when the user moves the mouse over an element. Example: button:hover { background-color: blue; color: white; } Use cases: Buttons changing color Highlighting cards or menu items Showing dropdown menus Key idea: It only works when a pointing device (mouse) is used. 4.🔹 2. :active (Active Style) 👉 What it means: Applies styles when the element is being clicked (pre