MediaQuery มีส่วนของ pointer ที่ใช้ตรวจจับว่าอุปกรณ์ที่ใช้เป็นตัวชี้หลักนั้นคืออะไร เป็น mouse หรือเป็น touchscreen เป็นต้น และมีส่วนของ hover ที่เป็นตัวบอกว่าอุปกรณ์ที่ชี้นั้น สามารถ hover เหนือ content บนหน้าเพจได้หรือไม่

แน่นอนว่าบน PC อุปกรณ์ที่ใช้ชี้หลักเป็นเมาส์จึงสามารถ hover บนหน้าเพจได้ ส่วนบนมือถือหรือไอแพดย่อมเป็น touchscreen ที่ hover บนหน้าเพจไม่ได้ อาศัยความจริงข้อนี้เราจึงใช้ MediaQuery ผ่าน pointer และ hover เพื่อตรวจสอบอุปกรณ์และจัดสไตล์ให้แตกต่างกันได้ ดังนี้

สำหรับ PC หรืออุปกรณ์ที่ใช้เมาส์เป็นหลัก จึงระบุ hover เป็น hover เพื่อบอกว่าจะจัดสไตล์เฉพาะบนเว็บของ PC ที่ใช้เมาส์เป็นหลักนั่นเอง

1@media (hover: hover) {
2}

กรณีของมือถือหรือแท็บเล็ตจะใช้ hover เป็น none เพราะเรา hover บนหน้าเพจผ่านการจิ้มหน้าจอไม่ได้ และระบุ pointer เป็น coarse

1@media (hover: none) and (pointer: coarse) {
2}