CSS 中 :hover 伪类的作用是什么？请举例说明它的常见使用场景，并说明它与其他状态伪类（如 :focus）的区别。

回答思路

1. 准确解释 :hover 伪类的触发条件（鼠标悬停）
2. 能举例说明典型场景（按钮、链接、卡片交互）
3. 能区分 :hover 与 :focus 的触发机制差异
4. 了解 :hover 在移动端或触屏设备上的局限