Pseudo-class
Pseudo-class در CSS برای انتخاب یک حالت خاص از یک عنصر استفاده میشه.
یعنی به جای اینکه فقط خود عنصر رو انتخاب کنیم، میایم یک وضعیت خاص از اون رو هدف قرار میدیم.
🔹 شکل کلی نوشتن Pseudo-class:
✅ پرکاربردترین Pseudo-class ها
1️⃣ :hover
وقتی ماوس روی یک عنصر میره.
2️⃣ :active
وقتی یک عنصر فعال (کلیک) میشه.
3️⃣ :focus
وقتی یک عنصر (مثلاً input) فوکوس میگیره.
4️⃣ :first-child
اولین فرزند یک عنصر رو انتخاب میکنه.
5️⃣ :last-child
آخرین فرزند یک عنصر رو انتخاب میکنه.
6️⃣ :nth-child(n)
یک فرزند خاص رو انتخاب میکنه (بر اساس شماره).
🔹 اینجا دومین <li>
سبز میشه.
میتونیم حتی فرمول بدیم:
7️⃣ :not(selector)
عناصری رو انتخاب میکنه که با انتخابگر مشخص شده مطابقت ندارن.
8️⃣ :checked
برای انتخاب input هایی که تیک خوردن یا انتخاب شدن (checkbox, radio).
9️⃣ :disabled و :enabled
برای فرمها کاربرد داره.
📌 مثال ترکیبی
✨ نتیجه: Pseudo-class ها به ما اجازه میدن رفتار و حالات مختلف عناصر رو در CSS کنترل کنیم.