光标和指针

在非触屏设备上，光标是用户了解自己正在与什么内容互动的重要方式。您还可以提供有用的提示，说明如何与元素互动，或者使用触控板或鼠标移动会如何影响您的网站。

游标

浏览器会自动处理一些常见的光标使用场景。

如果您是在有光标的设备上阅读本文，请探索该页面。您可能之前没有注意到光标的变化，但请注意它提供的提示。当指针移至文字上方时，光标会变为选择 I 形光标，表明您可以选择文字。如果您将光标悬停在某个链接上，光标会变成食指指向的手，表明您可以执行某项操作。其他所有位置都将显示默认光标，通常是箭头。

随着您制作的网站互动性越来越强，您可能需要自定义光标，以便用户更轻松地了解互动方式。

浏览器支持 cursor 属性的一系列关键字，这些关键字可提供有关拖动、调整大小、选择等操作的提示。

如果没有任何受支持的光标能传达元素的互动，您还可以提供 SVG 或 PNG 图像用作光标。

脱字符号

插入光标用于显示您在可编辑文本中的位置。它与光标不同，不会跟随鼠标移动。您可以使用 caret-color 更改颜色。

响应用户的指针输入

与使用触摸屏的用户相比，使用鼠标或触控板的用户能够与屏幕上更精确的点进行互动。如果您仅针对鼠标的精确度进行设计，那么使用触摸屏或精细运动控制有问题的用户可能无法按需与您的网页互动。

常见问题包括按钮过小或互动元素彼此距离过近。这会使相应元素难以与用户互动。

确保按钮和其他互动目标的尺寸足够大，是确保网站易于访问的重要一步。您还可以使用 pointer 和 any-pointer 媒体查询，根据用户输入设备的精确度自定义样式。

pointer 媒体功能是指用户的主输入设备，而 any-pointer 是指所有输入设备。您可以将鼠标等设备与 fine 相匹配，并将触摸屏等设备与 coarse 相匹配。值 none 表示用户未使用带指针的输入设备。

指针和触摸事件

停用特定触摸屏手势

使用触摸屏时，浏览器会处理一些常见的手势。例如，用两根手指触摸屏幕并将其分开通常会放大网站。虽然您不必在网站上实现这些行为，但在某些情况下，您可能需要停用或替换该行为。

如需选择停用浏览器对某些操作的处理，请列出您希望元素处理的操作。pan-x 和 pan-y 可启用单指平移手势。这些手势可以与 pinch-zoom 一起启用，后者可实现多指缩放和平移。

manipulation 关键字相当于 pan-x pan-y pinch-zoom。manipulation 会排除需要在短时间内多次触控的其他触控行为，例如双击缩放。

通过从 touch-action 中排除某个操作来停用浏览器对该操作的处理后，您可以为该操作设置指针事件。

停用所有事件和操作

在某些情况下，您可能需要指定某个元素不具有互动性。例如，如果您为某个按钮设置了 pointer-events: none，您将无法点击该按钮，甚至无法触发悬停状态。

检验您的掌握情况