الصيغة المزيفة :checked في CSS3

التعريف والاستخدام

CSS :checked الصيغة المزيفة تستخدم للتوافق مع أي عنصر مختار <input> أو <option> .

هذا ينطبق على عناصر <input type="radio"> و<input type="checkbox"> وأعمدة <option> في عناصر <select>.

مثال

مثال 1

ضبط نسيج دقيق أحمر لجميع عناصر <input> المفعلة:

input:checked {
  outline: 1px solid red;
}

تجربة شخصية

مثال 2

ضبط أنماط مختلفة عند اختيار الأزرار المزدوجة والخانات المفعلة والخيارات المفعلة:

input[type="radio"]:checked {
  box-shadow: 0 0 5px 3px blue;
}
input[type="checkbox"]:checked {
  box-shadow: 0 0 5px 3px maroon;
}
option:checked {
  color: blue;
  background-color: pink;
}

تجربة شخصية

جملة CSS

:checked {
  declarations css;
}

تفاصيل التقنية

الإصدار: CSS3

دعم المتصفح

الرقم في الجدول يحدد إصدار المتصفح الأول الذي يدعم هذا المزيج المزيف.

Chrome Edge Firefox Safari Opera
4.0 9.0 3.5 3.2 9.6