تغيير لون الصفحة عند المرور بالمؤشر على عنصر ضمن الصفحة في CSS

حاليًا لا يمكن القيام بذلك باستخدام CSS لأنه لا يوجد محدد يدعم الاستعلام للأعلى، المحدد الذي ذكرته يحدد الوسم body داخل الوسم h1 وهذا غير صحيح، يمكن استخدام جافاسكريبت والخصائص onmouseenter و onmousleave لتنفيذ تابع يعدل تنسيق body كالتالي:

<h1 onmouseenter="toggle(true)" onmousleave="toggle(false)">...<h1/>

وفي جافاسكريبت:

function toggle(enable){
  document.body.style.backgroundColor = enable ? "red" : "initial";
}

مستقبلًا سيتم إضافة دعم للمحدد has الذي سيحل المشكلة السابقة بالذات، لكن يحتاج الأمر بعض الوقت حتى يتم دعمه من قبل المتصفحات الشهيرة 

يمكنك أيضا توظيف الحدثين onmouseover و onmouseout لخدمة نفس الغرض: 

<h1 onmouseover="document.body.style.backgroundColor = 'red';" 
    onmouseout="document.body.style.backgroundColor = '';">اضغط</h1>

مثال تجريبي.

يمكنك الاطلاع على فهم الأحداث المتعلقة بتحريك الفأرة والتعامل معها في جافاسكربت