引导者cursor 属性
简介
CSS `cursor` 属性用于指定当鼠标悬停在元素上时指针的外观。它允许您创建自定义光标，从而增强用户体验。
一级标题：语法
``` cursor: value; ```
二级标题：属性值
| 值 | 描述 | |---|---| | auto | 浏览器默认光标 | | default | 默认指针 | | pointer | 指向手势 | | move | 移动光标 | | text | 文本选择光标 | | wait | 等待光标 | | help | 帮助光标 | | progress | 进度光标 | | no-drop | 禁止放置光标 | | not-allowed | 禁止操作光标 | | context-menu | 上下文菜单光标 | | cell | 单元格选择光标 | | vertical-text | 垂直文本光标 | | all-scroll | 全滚动光标 | | col-resize | 列调整大小光标 | | row-resize | 行调整大小光标 | | n-resize | 北向调整大小光标 | | s-resize | 南向调整大小光标 | | e-resize | 东向调整大小光标 | | w-resize | 西向调整大小光标 | | ne-resize | 东北向调整大小光标 | | se-resize | 东南向调整大小光标 | | sw-resize | 西南向调整大小光标 | | nw-resize | 西北向调整大小光标 | | ew-resize | 东西向调整大小光标 | | ns-resize | 南北向调整大小光标 | | nesw-resize | 东北西南向调整大小光标 | | nwse-resize | 西北东南向调整大小光标 | | custom | 自定义图像光标 | | inherit | 继承父元素的光标 |
二级标题：自定义光标
要创建自定义光标，可以使用 `url()` 函数，其中第一个参数是图像的路径，第二个参数指定热点的偏移量（图像中元素响应鼠标点击的位置）：``` cursor: url(image.png) 16 16; ```其中，`16 16` 表示热点的 x 和 y 偏移量，单位为像素。
示例
以下是一个使用 `cursor` 属性自定义光标的示例：``` body {cursor: url(hand.png) 16 16; } ```这将使整个文档中的光标都变成一只手。
注意
`cursor` 属性在某些浏览器中可能不支持某些值。
使用自定义光标会增加页面加载时间。
**cursor 属性****简介**CSS `cursor` 属性用于指定当鼠标悬停在元素上时指针的外观。它允许您创建自定义光标，从而增强用户体验。**一级标题：语法**``` cursor: value; ```**二级标题：属性值** | 值 | 描述 | |---|---| | auto | 浏览器默认光标 | | default | 默认指针 | | pointer | 指向手势 | | move | 移动光标 | | text | 文本选择光标 | | wait | 等待光标 | | help | 帮助光标 | | progress | 进度光标 | | no-drop | 禁止放置光标 | | not-allowed | 禁止操作光标 | | context-menu | 上下文菜单光标 | | cell | 单元格选择光标 | | vertical-text | 垂直文本光标 | | all-scroll | 全滚动光标 | | col-resize | 列调整大小光标 | | row-resize | 行调整大小光标 | | n-resize | 北向调整大小光标 | | s-resize | 南向调整大小光标 | | e-resize | 东向调整大小光标 | | w-resize | 西向调整大小光标 | | ne-resize | 东北向调整大小光标 | | se-resize | 东南向调整大小光标 | | sw-resize | 西南向调整大小光标 | | nw-resize | 西北向调整大小光标 | | ew-resize | 东西向调整大小光标 | | ns-resize | 南北向调整大小光标 | | nesw-resize | 东北西南向调整大小光标 | | nwse-resize | 西北东南向调整大小光标 | | custom | 自定义图像光标 | | inherit | 继承父元素的光标 |**二级标题：自定义光标**要创建自定义光标，可以使用 `url()` 函数，其中第一个参数是图像的路径，第二个参数指定热点的偏移量（图像中元素响应鼠标点击的位置）：``` cursor: url(image.png) 16 16; ```其中，`16 16` 表示热点的 x 和 y 偏移量，单位为像素。**示例**以下是一个使用 `cursor` 属性自定义光标的示例：``` body {cursor: url(hand.png) 16 16; } ```这将使整个文档中的光标都变成一只手。**注意*** `cursor` 属性在某些浏览器中可能不支持某些值。 * 使用自定义光标会增加页面加载时间。
