درس 31: شبه کلاس های CSS؛ ارومیا دیزاین
1. ZIP را استخراج کنید و index.html را باز کنید؛ اینترنت و نصب ابزار لازم نیست.
2. پیوند اول را با ماوس بررسی کنید: hover با قرار گرفتن اشاره گر و active هنگام نگه داشتن فعال سازی.
3. Tab و Shift+Tab بزنید؛ حلقه فوکوس باید محل کنترل فعال را نشان دهد. Enter روی پیوند، مقصد آن را باز می کند.
4. ورودی نام را با ماوس و کیبورد انتخاب کنید؛ focus روی ورودی و focus-within روی والد را مقایسه کنید.
5. گزینه دریافت نمونه را با کلیک یا Space تغییر دهید؛ رنگ و وزن متن تغییر می کند.
6. دکمه reset فرم را به حالت اولیه برمی گرداند؛ دکمه disabled فعال نمی شود و معمولاً در پیمایش Tab قرار نمی گیرد.
7. هیچ داده ای ارسال نمی شود؛ فرم دکمه submit فعال ندارد.
8. تمرین: فقط .exercise a را هدف بگیرید؛ hover با زمینه #075985 و متن سفید، active با زمینه #082f49 و focus-visible با outline: 3px solid #b45309 و فاصله 4px.
9. پاسخ از ابتدا فعال نیست. بعد از لینک style.css در head این خط را اضافه کنید:
<link rel="stylesheet" href="solution.css">
10. تمام اعداد HTML و CSS انگلیسی هستند. نشانگر فوکوس پیش فرض را حذف نکنید.
