الفرق بين المراجعتين ل"CSS/:active"

من موسوعة حسوب
< CSS
اذهب إلى التنقل اذهب إلى البحث
 
ط (تصحيح خطأ لغوي)
سطر 1: سطر 1:
 
<noinclude>{{DISPLAYTITLE: الصنف <code>‎:active</code>}}</noinclude>
 
<noinclude>{{DISPLAYTITLE: الصنف <code>‎:active</code>}}</noinclude>
الصنف الزائف <code>‎:active</code> في CSS (أي pseudo-class) يُمثِّل عنصرًا (مثل الأزرار) التي جرى تفعيلها من المستخدم. وعند استخدام الفأرة سيبدأ «تفعيل» العنصر عندما يضغط المستخدم على الزر الرئيسي لها وينتهي عند إفلات الضغط على ذاك الزر.
+
الصنف الزائف <code>‎:active</code> في CSS (أي pseudo-class) يُمثِّل عناصر (مثل الأزرار) التي جرى تفعيلها من المستخدم. وعند استخدام الفأرة سيبدأ «تفعيل» العنصر عندما يضغط المستخدم على الزر الرئيسي لها وينتهي عند إفلات الضغط على ذاك الزر.
  
 
من الشائع استخدام الصنف الزائف <code>‎:active</code> على عناصر <code>[[HTML/a|&lt;a&gt;]]</code> أو <code>[[HTML/button|<button>]]</code>، لكن يمكن استخدامه على بقية العناصر أيضًا:<syntaxhighlight lang="css">
 
من الشائع استخدام الصنف الزائف <code>‎:active</code> على عناصر <code>[[HTML/a|&lt;a&gt;]]</code> أو <code>[[HTML/button|<button>]]</code>، لكن يمكن استخدامه على بقية العناصر أيضًا:<syntaxhighlight lang="css">

مراجعة 15:26، 27 يناير 2018

الصنف الزائف ‎:active في CSS (أي pseudo-class) يُمثِّل عناصر (مثل الأزرار) التي جرى تفعيلها من المستخدم. وعند استخدام الفأرة سيبدأ «تفعيل» العنصر عندما يضغط المستخدم على الزر الرئيسي لها وينتهي عند إفلات الضغط على ذاك الزر.

من الشائع استخدام الصنف الزائف ‎:active على عناصر <a> أو <button>، لكن يمكن استخدامه على بقية العناصر أيضًا:

a:active {
  color: red;
}

الأنماط المُعرَّفة للصنف الزائف ‎:active سيتم تجاوزها بأيّة أصناف زائفة تليها خاصة بالروابط (مثل ‎:link أو ‎:hover أو ‎:visited) التي لها نفس درجة التحديد. ولتطبيق الأنماط تطبيقًا صحيحًا فضع قاعدة ‎:active بعد جميع القواعد الخاصة بالروابط وفق الترتيب ‎:link ثم ‎:visited ثم ‎:hover ثم ‎:active.

ملاحظة: في الأجهزة التي فيها أكثر من زر للفأرة، فتقول CSS3 أنَّ الصنف الزائف ‎:active سيُطبَّق على الزر الرئيسي فقط.

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

:active

أمثلة

لاحظ ترتيب تطبيق الأصناف الزائفة على عنصر <a>:

<a href="#">This link will turn lime while you click on it.</a>

شيفرة CSS:

a:link { color: blue; }
a:visited { color: purple; }
a:hover { background: yellow; }
a:active { color: lime; }

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

الميزة Chrome Firefox Internet Explorer Opera Safari
الدعم الأساسي (العنصر <a>) 1.0 1.0 4.0 5.0 1.0
توسعة الدعم إلى بقية العناصر 1.0 1.0 8.0 7.0 1.0

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