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

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

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

مثال تجريبي.

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

حاليًا لا يمكن القيام بذلك باستخدام 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 الذي سيحل المشكلة السابقة بالذات، لكن يحتاج الأمر بعض الوقت حتى يتم دعمه من قبل المتصفحات الشهيرة