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

من موسوعة حسوب
< CSS
اذهب إلى التنقل اذهب إلى البحث
 
سطر 43: سطر 43:
 
|2.0.4
 
|2.0.4
 
|}
 
|}
 +
==انظر أيضًا==
 +
* صفحة الصنف الزائف <code>[[CSS/:focus|focus:]]</code> الذي يُمثِّل عنصرًا (مثل عناصر النماذج) الذي استقبل التركيز (foucs).
 +
* صفحة الصنف الزائف <code>[[CSS/:focus-within|focus-within:]]</code> الذي يُمثِّل عنصرًا (مثل عناصر النماذج) التي استقبل التركيز (foucs) أو احتوى على عنصر قد استقبل التركيز.
 +
 
==مصادر ومواصفات==
 
==مصادر ومواصفات==
 
*معيار [https://html.spec.whatwg.org/multipage/scripting.html#selector-hover HTML Living Standard].
 
*معيار [https://html.spec.whatwg.org/multipage/scripting.html#selector-hover HTML Living Standard].

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

الصنف الزائف ‎:hover في CSS (أي pseudo-class) يُطابِق العناصر التي يتفاعل المستخدم معها مع جهاز تأشير لكن ليس بالضرورة أن يفعِّلها، ويُفعَّل هذا الصنف الزائف عادةً عندما يمر المستخدم بجهاز التأشير (الفأرة غالبًا) فوق العنصر.

a:hover {
  color: orange;
}

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

لاحظ أنَّ الصنف الزائف ‎:hover له مشاكل في الشاشات اللمسية، فسلوكه يتعمد على المتصفح، فقد لا يُفعَّل الصنف الزائف ‎:hover أبدًا، أو يُفعَّل لبرهة من الزمن بعد لمس العنصر، أو يُفعَّل ويبقى مفعَّلًا حتى يلمس المستخدم عنصرًا آخر.

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

:hover

أمثلة

لاحظ كيف سيتغير تنسيق الرابط عندما يستقبل تمر الفأرة فوقه:

<a href="#">حاول المرور فوق هذا الرابط</a>

شيفرة CSS:

a {
  background-color: powderblue;
  transition: background-color .5s;
}

a:hover {
  background-color: gold;
}

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

الميزة Chrome Firefox Internet Explorer Opera Safari
الدعم الأساسي مدعومة مدعومة 7.0 4.0 2.0.4

انظر أيضًا

  • صفحة الصنف الزائف focus: الذي يُمثِّل عنصرًا (مثل عناصر النماذج) الذي استقبل التركيز (foucs).
  • صفحة الصنف الزائف focus-within: الذي يُمثِّل عنصرًا (مثل عناصر النماذج) التي استقبل التركيز (foucs) أو احتوى على عنصر قد استقبل التركيز.

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