الفرق بين المراجعتين لصفحة: «CSS/:enabled»

من موسوعة حسوب
< CSS
لا ملخص تعديل
 
لا ملخص تعديل
 
(3 مراجعات متوسطة بواسطة مستخدمين اثنين آخرين غير معروضة)
سطر 13: سطر 13:
<syntaxhighlight lang="html">
<syntaxhighlight lang="html">
<form action="url_of_form">
<form action="url_of_form">
   <label for="FirstField">First field (enabled):</label>
   <label for="FirstField">الحقل الأول (enabled):</label>
   <input type="text" id="FirstField" value="Lorem"><br>
   <input type="text" id="FirstField" value="Lorem"><br>


   <label for="SecondField">Second field (disabled):</label>
   <label for="SecondField">الحقل الثاني(disabled):</label>
   <input type="text" id="SecondField" value="Ipsum" disabled="disabled"><br>
   <input type="text" id="SecondField" value="Ipsum" disabled="disabled"><br>


سطر 46: سطر 46:
|3.1
|3.1
|}
|}
==مصادر ومواصفات==
==انظر أيضًا==
* صفحة الصنف الزائف <code>[[CSS/:disabled|disabled:]]</code> الذي يُمثِّل أي عنصر مُعطَّل.
* صفحة الصنف الزائف <code>[[CSS/:checked|checked:]]</code> الذي يُمثِّل أيّة أزرار انتقاء ([[HTML/input/radio|radio button]]) أو صناديق تأشير ([[HTML/input/checkbox|checkbox]]) أو خيارات <code>[[HTML/option|<option>]]</code> في عنصر <code>[[HTML/select|<select>]]</code> تم تحديدها أو انتقاؤها.
* صفحة الصنف الزائف <code>[[CSS/:default|default:]]</code> الذي يُمثِّل أي عنصر مُختار افتراضيًا بين مجموعة من العناصر المتعلقة به.
 
== مصادر ومواصفات ==
*معيار [https://html.spec.whatwg.org/multipage/#selector-enabled HTML Living Standard].
*معيار [https://html.spec.whatwg.org/multipage/#selector-enabled HTML Living Standard].
*مواصفة [http://www.w3.org/TR/html5/#selector-enabled HTML5].
*مواصفة [http://www.w3.org/TR/html5/#selector-enabled HTML5].
سطر 52: سطر 57:
*مواصفة [https://drafts.csswg.org/css-ui-3/#pseudo-classes CSS Basic User Interface Module Level 3].
*مواصفة [https://drafts.csswg.org/css-ui-3/#pseudo-classes CSS Basic User Interface Module Level 3].
*مواصفة [https://drafts.csswg.org/selectors-3/#enableddisabled Selectors Level 3].
*مواصفة [https://drafts.csswg.org/selectors-3/#enableddisabled Selectors Level 3].
[[تصنيف:CSS]]
[[تصنيف:CSS|{{SUBPAGENAME}}]]
[[تصنيف:CSS Selectors]]
[[تصنيف:CSS Selectors|{{SUBPAGENAME}}]]
[[تصنيف:CSS pseudo-class]]
[[تصنيف:CSS pseudo-class|{{SUBPAGENAME}}]]

المراجعة الحالية بتاريخ 21:02، 19 أكتوبر 2018

الصنف الزائف ‎:enabled في CSS (أي pseudo-class) يُمثِّل أي عنصر مُفعّل، أي يمكن اختياره أو النقر عليه أو الكتابة فيه أو يمكن التركيز عليه (focus):

input:enabled {
  color: blue;
}

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

:enabled

أمثلة

سنجعل عناصر <input> المُفعّلة بلونٍ أخضر، وبلونٍ فضي عندما تكون معطلةً، وذلك كي يتمكن المستخدم من التفريق بصريًا بين العناصر التي يستطيع التفاعل معها وتلك التي لا يستطيع التفريق بينها:

<form action="url_of_form">
  <label for="FirstField">الحقل الأول (enabled):</label>
  <input type="text" id="FirstField" value="Lorem"><br>

  <label for="SecondField">الحقل الثاني(disabled):</label>
  <input type="text" id="SecondField" value="Ipsum" disabled="disabled"><br>

  <input type="button" value="Submit">
</form>

شيفرة CSS:

input:enabled {
  color: #2b2;
}

input:disabled {
  color: #aaa;
}

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

الميزة Chrome Firefox Internet Explorer Opera Safari
الدعم الأساسي 1.0 1.0 9.0 9.0 3.1

انظر أيضًا

  • صفحة الصنف الزائف disabled: الذي يُمثِّل أي عنصر مُعطَّل.
  • صفحة الصنف الزائف checked: الذي يُمثِّل أيّة أزرار انتقاء (radio button) أو صناديق تأشير (checkbox) أو خيارات <option> في عنصر <select> تم تحديدها أو انتقاؤها.
  • صفحة الصنف الزائف default: الذي يُمثِّل أي عنصر مُختار افتراضيًا بين مجموعة من العناصر المتعلقة به.

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