语法:
selector {
cursor: value;
}
可选值:
1. auto: 默认值,由浏览器决定鼠标样式。
2. default: 浏览器默认的鼠标样式,通常是一个箭头。
3. none: 隐藏鼠标指针。
4. context-menu: 上下文菜单(通常是右键菜单)的小图标。
5. help: 表示帮助可用,通常是一个问号。
6. pointer: 表示链接,通常是一个手指。
7. progress: 表示程序运行中,通常是一个旋转的圆形。
8. wait: 表示等待,通常是一个沙漏。
9. cell: 表示可调整的单元格边缘。
10. crosshair: 十字线。
11. text: 文本光标,通常是一条竖线。
12. vertical-text: 垂直文本光标,通常是一条横线。
13. alias: 表示链接别名,通常是一个箭头。
14. copy: 表示复制,通常是两个文档重叠。
15. move: 表示移动,通常是一个十字箭头。
16. no-drop: 表示不允许拖放。
17. not-allowed: 表示操作不被允许。
18. e-resize、n-resize、ne-resize等: 表示可在相应方向上调整大小的光标。
19. grab: 表示可拖动。
20. grabbing: 表示正在拖动。
示例代码:
.button {
cursor: pointer;
}
.text-input {
cursor: text;
}
.resizeable {
cursor: nwse-resize; /* 右下角调整大小 */
}
以上示例代码中,.button类的元素将显示一个手指光标,.text-input类的元素将显示一个文本光标,.resizeable类的元素将显示一个右下角调整大小的光标。你可以根据具体的需求选择合适的鼠标样式。
转载请注明出处:http://www.zyzy.cn/article/detail/4040/CSS