کلاس موقت :focus-within CSS

تعریف و استفاده

CSS :focus-within کلاس‌های موقت برای تطبیق با یک عنصر استفاده می‌شوند، اگر این عنصر یا یکی از فرزندان آن‌ها به فokus برسند.

مثال

وقتی یکی از فیلدهای فرم به فokus می‌رسد، سبک فرم را انتخاب و تنظیم کنید:

form:focus-within {
  پیمانه: 2 پیکسل سخت سیاه;
  رنگ پس‌زمینه: رنگ خاکی;
  رنگ: سیاه;
}

آزمایش کنید

نویسه‌های CSS

:focus-within {
  اظلاعات css;
}

جزئیات فنی

نسخه: CSS4

پشتیبانی مرورگر

اعداد در جدول نشان‌دهنده نسخه اولین مرورگر هستند که این کلاس موقت را کاملاً پشتیبانی می‌کند.

کروم ایلج افرادا سافاری آپرا
60 79 52 10.1 47

صفحات مرتبط

تدریس:کلاس‌های موقت CSS

مطالعه:پseudo-class :focus CSS