Cursor 代码，不显示自定义 cursor 集。 CSS

Question

CSS 和 HTML 还很新，希望有人能帮我解决这个问题。 我希望能够更改 cursor 的图标，尽管当我运行代码时，根本没有任何变化。 几次访问 chatGPT 对我也没有太大帮助。 这是我的代码：

body2 {
  cursor: url("assets/img/wiiu/Smile_icon_32x32.png"), url("assets/img/wiiu/cursor.svg"), auto;
}

是的，它是 32x32。

我试过把它移到不同的班级，改变措辞，改变一切。 尽管没有任何效果。

Answer 1

这是一个很好的参考： https://developer.mozilla.org/en-US/docs/Web/CSS/cursor?retiredLocale=de

所以基本上你尝试应用到body2 HTML 元素你是 CSS 代码。 如果它是 class 尝试 CSS 选择器.body2 {}或者在这种情况下它的 id 是 HTML 元素#body2 {} 。

在你的 css 中，你有一张主图片，第二张作为备用图片。 只需确保设置与 CSS 文件位置对应的正确路径即可。 为确保这一点，您还可以尝试使用完整路径而不是相对路径，例如C:\Users\xxx\Smile_icon_32x32.png

Answer 2

您使用了错误的 css 声明，只有当您定义了一个自定义的 html 元素时，您的代码才会工作<body2>作为标签。

你可能想要的是：

身体 {... }
应用于<body>标签

或 css class

.body {...} 应用于或任何其他具有body作为 class 的标签。

或 css id

#body {... } 应用于或以body作为 id 的任何其他类型的标签。

或者检查浏览器控制台是否应用了规则以及图像路径是否正确解析。

Answer 3

这是一个示例，其中http://example.com/32x32/990000/fff.png&text=PNG不存在并且https://dummyimage.com/32x32/009900/fff.gif&text=GIF存在，因此 gif 将是使用而不是 png：

 .body2 { display:inline-block; cursor: url("http://example.com/32x32/990000/fff.png&text=PNG"),url("https://dummyimage.com/32x32/009900/fff.gif&text=GIF"), auto; }

 <div class="body2">display</div>

Cursor 代码，不显示自定义 cursor 集。 CSS

问题描述

3 个解决方案

解决方案1
1 2023-01-16 23:04:15

解决方案2
0 2023-01-16 22:59:41

解决方案3
0 2023-01-17 03:33:06

Cursor 代码，不显示自定义 cursor 集。 CSS

问题描述

3 个解决方案

解决方案1 1 2023-01-16 23:04:15

解决方案2 0 2023-01-16 22:59:41

解决方案3 0 2023-01-17 03:33:06

解决方案1
1 2023-01-16 23:04:15

解决方案2
0 2023-01-16 22:59:41

解决方案3
0 2023-01-17 03:33:06