الصنف ‎:hover

من موسوعة حسوب
< CSS
اذهب إلى: تصفح، ابحث
الصنف الزائف ‎:hover في CSS (أي pseudo-class) يُطابِق العناصر التي يتفاعل المستخدم معها مع جهاز تأشير لكن ليس بالضرورة أن يفعِّلها، ويُفعَّل هذا الصنف الزائف عادةً عندما يمر المستخدم بجهاز التأشير (الفأرة غالبًا) فوق العنصر.
a:hover {
  color: orange;
}
الأنماط المُعرَّفة للصنف الزائف ‎:hover سيتم تجاوزها بأيّة أصناف زائفة تليها خاصة بالروابط (مثل ‎:link أو ‎:active أو ‎:visited) التي لها نفس درجة التحديد. ولتطبيق الأنماط تطبيقًا صحيحًا فضع قاعدة ‎:hover وفق الترتيب ‎:link ثم ‎:visited ثم ‎:hover ثم ‎:active.

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

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

أمثلة

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

<a href="#">Try hovering over this link.</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

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