شبه‌طبقه :checked در CSS3

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

CSS :checked شبه‌طبقه برای تطبیق هر عنصر انتخاب شده <input> یا <option> .

این برای عناصر <input type="radio">،<input type="checkbox"> و <select> با گزینه‌های <option> اعمال می‌شود.

مثال

مثال 1

یک خط قرمز نازک دور از همه عناصر <input> انتخاب شده تنظیم کنید:

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

آزمایش کنید

مثال 2

برای تنظیم استایل‌های مختلف برای دکمه‌های انتخابی، چک باکس‌ها و گزینه‌ها در حالت انتخاب شده، استفاده کنید:

input[type="radio"]:checked {
  box-shadow: 0 0 5px 3px آبی;
}
input[type="checkbox"]:checked {
  box-shadow: 0 0 5px 3px قرمز کبود;
}
option:checked {
  color: blue;
  background-color: pink;
}

آزمایش کنید

قوانین CSS

:checked {
  css declarations;
}

جزئیات فنی

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

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