对span设置鼠标光标样式
1 <html> 2 3 <body> 4 <p>请把鼠标移动到单词上，可以看到鼠标指针发生变化：</p> 5 <span style="cursor:auto">Auto</span><br /> 6 <span style="cursor:crosshair">Crosshair</span><br /> 7 <span style="cursor:default">Default</span><br /> 8 <span style="cursor:pointer">Pointer</span><br /> 9 <span style="cursor:move">Move</span><br /> 10 <span style="cursor:e-resize">e-resize</span><br /> 11 <span style="cursor:ne-resize">ne-resize</span><br /> 12 <span style="cursor:nw-resize">nw-resize</span><br /> 13 <span style="cursor:n-resize">n-resize</span><br /> 14 <span style="cursor:se-resize">se-resize</span><br /> 15 <span style="cursor:sw-resize">sw-resize</span><br /> 16 <span style="cursor:s-resize">s-resize</span><br /> 17 <span style="cursor:w-resize">w-resize</span><br /> 18 <span style="cursor:text">text</span><br /> 19 <span style="cursor:wait">wait</span><br /> 20 <span style="cursor:help">help</span> 21 </body> 22 23 </html>
|
crosshair; |
十字准心 |
The cursor render as a crosshair |
|
cursor: pointer; |
手 |
The cursor render as a pointer (a hand)
that indicates a link |
|
cursor: wait; |
等待/沙漏 |
The cursor indicates that the program is
busy (often a watch or an hourglass) |
|
cursor: help; |
帮助 |
The cursor indicates that help is
available (often a question mark or a balloon) |
|
cursor: no-drop; |
无法释放 |
cursor: no-drop; |
|
cursor: text; |
文字/编辑 |
The cursor indicates text |
|
cursor: move; |
可移动对象 |
The cursor indicates something that
should be moved |
|
cursor: n-resize; |
向上改变大小(North) |
The cursor indicates that an edge of a
box is to be moved up (north) |
|
cursor: s-resize; |
向下改变大小(South) |
The cursor indicates that an edge of a
box is to be moved down (south) |
|
cursor: e-resize; |
向右改变大小(East) |
The cursor indicates that an edge of a
box is to be moved right (east) |
|
cursor: w-resize; |
向左改变大小(West) |
The cursor indicates that an edge of a
box is to be moved left (west) |
|
cursor: ne-resize; |
向上右改变大小(North East) |
The cursor indicates that an edge of a
box is to be moved up and right (north/east) |
|
cursor: nw-resize; |
向上左改变大小(North West) |
The cursor indicates that an edge of a
box is to be moved up and left (north/west) |
|
cursor: se-resize; |
向下右改变大小(South East) |
The cursor indicates that an edge of a
box is to be moved down and right (south/east) |
|
cursor: sw-resize; |
向下左改变大小(South West) |
The cursor indicates that an edge of a
box is to be moved down and left (south/west) |
|
cursor: auto; |
自动 |
The browser sets a cursor |
|
cursor:not-allowed; |
禁止 |
cursor:not-allowed; |
|
cursor: progress; |
处理中 |
cursor: progress; |
|
cursor: default; |
系统默认 |
The default cursor (often an arrow) |
|
cursor: url(' # '); |
用户自定义（可用动画） |
The url of a custom cursor to be used. Note: Always
define a generic cursor at the end of the list in case none of the
url-defined cursors can be used |
参考链接：http://www.w3school.com.cn/cssref/pr_class_cursor.asp
http://www.jb51.net/css/23361.html
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列：如何用heaptrack跟踪.NET程序的非托管内存泄露
· TypeScript + Deepseek 打造卜卦网站：技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗？
· 如何调用 DeepSeek 的自然语言处理 API 接口并集成到在线客服系统
· 【译】Visual Studio 中新的强大生产力特性
· 2025年我用 Compose 写了一个 Todo App