自定义鼠标指针样式

css自定义鼠标指针样式是使用图像Cursor：url（）。今天在项目中，我们将使用自定义鼠标样式，格式为：

css：{cursor：url（'Absolute path picture（format：cur，ico）'），-moz-zoom-out;} //跟随FF

css：（cursor：url（'absolute path'），auto;} // IE，FF，Chrome浏览器都可以使用

正面url是自定义鼠标格式，图像的绝对路径地址，背面参数是CSS标准光标样式（在IE中不是必需的）

图标的格式分为不同的浏览器：IE支持cur，ani和ico的三种格式，而FF支持bmp，gif，jpg，cur和ico的这些格式。它不支持ani格式，也不支持它。 gif格式，因此通常最好将图片保存为cur或ico格式。如果是ani格式，则可以使用FF下的jpg，gif，bmp替换（光标：url（.... ani），url（.... gif），自动）

还有几点需要注意：1.图片地址是绝对路径，2.图片大小最好为32 * 32。无论如何，每个浏览器下的解析大小都是不同的。

使用Cursor：url（）：

光标：url（），指针；

url：要使用的自定义光标的URL。图片类型必须为.cur或.ani格式。 （我在此项目中使用了.ico格式，但未发现浏览器兼容性问题）

pointer：默认的鼠标光标样式。当找不到可用的已定义游标时，将使用此游标。

在最近的项目中，我使用了将鼠标光标设置为自定义图片的特殊效果，并且在使用Cursor：url（）的过程中遇到了许多问题。

问题1：浏览器不兼容：

它可以在FF Firefox中正常显示，但最初不能在IE中显示。后来，鼠标图像的尺寸太小。在Google浏览器中，鼠标图像的大小更加突出-超级大。

遇到的情况与百度的结果恰好相反。朋友遇到的许多问题都与FF浏览器不兼容。

对于鼠标图片未显示在浏览器中的问题，问题可能出在对鼠标图片的URL路径的引用上。您可以分别尝试绝对路径参考和相对路径参考。

问题2：浏览器之间的鼠标图片大小不一致：

这种问题应该与浏览器之间的游标图片分析有关。一开始，我的鼠标图片大小为59 * 56。后来，当我将鼠标图片的尺寸更改为32 * 32后，图片尺寸不一致。解决了。​​

（经测试发现，如果大小超过32 * 32，则会出现此问题）

问题3在IE中使用Cursor URL（）时，会发生鼠标闪烁问题：

将Title或Alt添加到用于设置Cursor URL（）的容器元素时，会发生此现象。最后，标题标签被不情愿地删除了。是因为Cursor与IE中的Title和Alt冲突吗？

本文来自电脑杂谈，转载请注明本文网址：
http://www.pc-fly.com/a/bofangqi/article-363547-1.html