Html CSS 自定义光标在 FF/Chrome 中不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6623769/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS custom cursor doesn't work in FF/Chrome
提问by Gajus
I am trying to create a custom cursor using the following image:
我正在尝试使用下图创建自定义光标：
http://anuary.com/dev/hp/pad3/public/images/hand-cursor.png
The image size must be retained. I've tried simply to use body { cursor: url('http://anuary.com/dev/hp/pad3/public/images/hand-cursor.png'); }, though that doesn't work in FF/Chrome. (not even checking other browsers)
必须保留图像大小。我试过简单地使用body { cursor: url('http://anuary.com/dev/hp/pad3/public/images/hand-cursor.png'); }，尽管这在 FF/Chrome 中不起作用。（甚至不检查其他浏览器）
What's the reason for it not working?
它不起作用的原因是什么？
回答by xec
The problem is not just with your css code lacking second argument but with the image file.
问题不仅在于您的 css 代码缺少第二个参数，还在于图像文件。
If you simply resize, make it smaller (i tried 32px for testing purposes) it works like a charm.
如果你只是简单地调整大小，让它变小（我试过 32px 用于测试目的）它就像一个魅力。
You might also want "pointer" rather than auto, judging by the look of the image;
根据图像的外观判断，您可能还需要“指针”而不是自动；
cursor: url('http://anuary.com/dev/hp/pad3/public/images/hand-cursor.png'), pointer;
EDIT: i realize now you wanted to keep the size but it just won't work. see https://developer.mozilla.org/en/Using_URL_values_for_the_cursor_propertyfor more info
编辑：我现在意识到您想保持大小，但它不起作用。有关更多信息，请参阅https://developer.mozilla.org/en/Using_URL_values_for_the_cursor_property
回答by detaylor
Firefox requires a second non-url argument such as
Firefox 需要第二个非 url 参数，例如
cursor: url('http://anuary.com/dev/hp/pad3/public/images/hand-cursor.png'), auto;
There is a great reference at Quirksmode CSS2 - Cursor Styles
Quirksmode CSS2 - Cursor Styles 中有一个很好的参考
