css - 改变光标的颜色

Question

我正在尝试将样式应用于光标。下面是代码

 <span style="cursor:help ; color:red; font-size:40px;">Help</span><br>

当我尝试 color:red 时，它将文本“帮助”更改为红色。如何让光标变红？

这是小提琴 - https://jsfiddle.net/user_123/aoubt7yv/

请帮忙。提前致谢。

原文由 user56690 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

游标并不像您预期的那样真正具有样式，至少不使用传统上以 DOM 元素为目标的属性。

最好的方法是将 cursor 属性设置为包含您首选光标的 URL，如下所示：

 /* This will change your cursor to the image at your URL */
cursor: url('{your-red-cursor-url}'), auto;

例子

 .red-cursor {
  color:red;
  font-size:40px;
  cursor: url('http://www.spacebug.50webs.com/visible.gif'), auto;
}

 <div class='red-cursor'>
    Testing
  </div>

原文由 Rion Williams 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

您可能需要将其作为图像来执行，因为 color 用于更改文本的颜色。

你可以尝试这样的图像：

.cursor { cursor: url(images/my-cursor-design.png), auto; }

原文由 Andy Holmes 发布，翻译遵循 CC BY-SA 3.0 许可协议