DevShelf

Appearance

cursor ​

描述 ​

该 cursor 属性指定在元素的边框、填充和内容上为指针设备显示的光标类型。

效果展示 ​

语法 ​

css
cursor: [ [<uri> [<x> <y>]?, ] * [ auto | default | none | context-menu | help |
    pointer | progress | wait | cell | crosshair | text | vertical-text | alias
    | copy | move | no-drop | not-allowed | e-resize | n-resize | ne-resize |
    nw-resize | s-resize | se-resize | sw-resize | w-resize | ew-resize |
    ns-resize | nesw-resize | nwse-resize | col-resize | row-resize | all-scroll
    | zoom-in | zoom-out]] | inherit;

值 ​

通用游标:

  • auto 浏览器根据当前上下文确定要显示的光标。
  • default 依赖于平台的默认游标。通常呈现为箭头。
  • none 不会为元素呈现任何游标。
链接和状态光标:
  • context-menu 上下文菜单可用于光标下的对象。通常呈现为箭头，旁边有一个类似菜单的小图形。
  • help 帮助可用于光标下的对象。通常呈现为问号或气球。
  • pointer 光标是指示链接的指针。
  • progress 程序在后台繁忙，但用户仍然可以与界面交互。
  • wait 指示程序繁忙，用户应等待。通常呈现为手表或沙漏。
选择游标:
  • cell 指示可以选择一个单元格或一组单元格。通常呈现为中间有一个点的粗加号。
  • crosshair 简单的十字准线（例如，类似于“+”号的短线段）。通常用于指示二维位图选择模式。
  • text 可以选择指示文本，通常是工字钢。
  • vertical-text 指示可以选择垂直文本，通常是横向工字形。
拖放光标:
  • alias 指示要创建某物的别名/快捷方式。通常呈现为箭头，旁边有一个小的弯曲箭头。
  • copy 指示要复制的内容。通常呈现为箭头，旁边有一个小加号。
  • move 指示要移动某些内容。
  • no-drop 指示拖动的项目不能放在当前光标位置。通常呈现为带有小圆圈的手或指针，其中有一条线穿过。
  • not-allowed 指示不会执行请求的操作。通常呈现为一个圆圈，其中有一条线穿过。
调整光标大小和滚动光标:
  • n-resize 一些边缘将被移动。例如，当移动从框的东南角开始时，将使用 se-resize 光标。 上
  • ne-resize 一些边缘将被移动。例如，当移动从框的东南角开始时，将使用 se-resize 光标。 左上
  • e-resize 一些边缘将被移动。例如，当移动从框的东南角开始时，将使用 se-resize 光标。 右
  • se-resize 一些边缘将被移动。例如，当移动从框的东南角开始时，将使用 se-resize 光标。 右下
  • s-resize 一些边缘将被移动。例如，当移动从框的东南角开始时，将使用 se-resize 光标。 下
  • sw-resize 一些边缘将被移动。例如，当移动从框的东南角开始时，将使用 se-resize 光标。 右下
  • w-resize 一些边缘将被移动。例如，当移动从框的东南角开始时，将使用 se-resize 光标。 左
  • nw-resize 一些边缘将被移动。例如，当移动从框的东南角开始时，将使用 se-resize 光标。 左上
  • ew-resize 指示双向调整光标大小。左右
  • ns-resize 指示双向调整光标大小。下上
  • nesw-resize 指示双向调整光标大小。左下右上
  • nwse-resize 指示双向调整光标大小。左上右下
  • col-resize 指示可以水平调整项目/列的大小。通常呈现为指向左右的箭头，并用竖线分隔它们。
  • row-resize 指示可以垂直调整项/行的大小。通常呈现为上下指向的箭头，并用水平条分隔它们。
  • all-scroll 指示内容可以向任意方向滚动。通常呈现为向上、向下、向左和向右的箭头，中间有一个点。
缩放光标:
  • zoom-in 指示可以放大（放大）某些内容。
  • zoom-out 指示可以缩小（放大）某些内容。
图像光标:
  • <uri> 用户代理从 URI 指定的资源中检索游标。如果用户代理无法处理游标列表中的第一个游标，则必须尝试处理第二个游标，依此类推。如果用户代理无法处理任何用户定义的游标，则必须使用列表末尾的 cursor 关键字。虽然规范没有限制光标图像的大小，但用户代理通常会对其进行限制，以避免潜在的滥用。例如，在Firefox和Chromium上，默认情况下光标图像限制为128x128像素，但建议将光标图像大小限制为32x32像素。使用大于用户代理支持的最大大小的图像的光标更改通常将被忽略。