الصنف ‎:indeterminate

من موسوعة حسوب
< CSS
اذهب إلى التنقل اذهب إلى البحث
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

الصنف الزائف ‎:indeterminate في CSS (أي pseudo-class) يُمثِّل أيّة نماذج تكون حالتها غير معروفة (indeterminate):

input:indeterminate {
  background: lime;
}

يمكن أن يُطابِق هذا المُحدَّد العناصر الآتية:

  • صندوق تأشير checkbox الذي ضُبِطَت الخاصية indeterminate فيه إلى true عبر JavaScript.
  • أزرار الانتقاء radio عندما تكون جميع الأزرار التي لها نفس القيمة للخاصية name غير منتقاةً.
  • عناصر <progress> في الحالة غير المعروفة.

الشكل العام لهذا المحدد:

:indeterminate

أمثلة

سنُطبِّق في المثال الآتي أنماط خاصة لعناصر <label> المرتبطة بحقول النموذج ذات الحالة غير المعروفة:

<div>
  <input type="checkbox" id="checkbox">
  <label for="checkbox">هذا العنصر يبدأ باللون الليموني</label>
</div>
<div>
  <input type="radio" id="radio">
  <label for="radio">هذا العنصر يبدأ باللون الليموني</label>
</div>

شيفرة CSS:

input:indeterminate + label {
  background: lime;
}

شيفرة JavaScript:

var inputs = document.getElementsByTagName("input");

for (var i = 0; i < inputs.length; i++) {
  inputs[i].indeterminate = true;
}

مثال عن تطبيق أنماط خاصة على عناصر <progress> إذا كانت حالتها غير معروفة (أي لم تُستعمَل الخاصية value):

<progress>

شيفرة CSS:

progress {
  margin: 4px;
}

progress:indeterminate {
  opacity: 0.5;
  background-color: lightgray;
  box-shadow: 0 0 2px 1px red;
}

دعم المتصفحات

الميزة Chrome Firefox Internet Explorer Opera Safari
الدعم الأساسي مدعومة مدعومة 9.0 10.60 3.0
<progress> 6.0 6.0 10 ؟ 5.2
أزرار الانتقاء 39.0 51 غير مدعومة ؟ غير مدعومة

مصادر ومواصفات