Firefox 72 不显示来自 SVG 文件的 CSS 自定义光标答案

【问题标题】：Firefox 72 not displaying CSS Custom Cursor from SVG fileFirefox 72 不显示来自 SVG 文件的 CSS 自定义光标
【发布时间】：2020-02-13 23:42:28
【问题描述】：

注意：这个问题最初发布在 Webmasters Stack Exchange (Firefox 72 not displaying CSS Custom Cursor from SVG file)，因为我关注的是 Firefox 浏览器能力。然而，事实证明我不应该问浏览器功能，但更确切地说，是 CSS 约束。所以，在归根结底，这是一道 CSS 题，不是 Firefox 题。因此根据@Rob 的建议，我已经在 Stack Overflow 上转发了这个问题。

我目前正在试验 CSS 自定义光标：

cursor: url(' [... URL HERE...'), auto;

我发现 Firefox 72 对 SVG 游标或 GIF 游标都不满意（尽管它对 PNG 游标完全满意)。

根据：Can I Use CSS property: cursor: url() 应该没有问题。

但显然有。

谁能解释一下这里的问题是什么？

是这样吗：

Firefox 不支持 SVG 光标并且 caniuse.com 被误导？
Firefox 是否支持 SVG 光标，而我做错了什么？

添加：

哦。这很奇怪。也不适用于 Chrome 79。不知道发生了什么。

【问题讨论】：

标签： css firefox svg

【解决方案1】：

有一个 CSS 约束，即自定义光标图像的尺寸不得超过128px x 128px。

当使用 SVG 文件作为自定义光标图像时，有效尺寸必须硬编码到 SVG 文件中。

示例：

<svg xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink="http://www.w3.org/1999/xlink"
     width="100"
     height="100"
     viewBox="0 0 250 250">

【讨论】：