css Cursor: url（）自定义鼠标指针样式为图片

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

css: {cursor: url（'Absolute path image（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（cursor: 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-307554-1.html