Npcink Blog
切换菜单

怎么添加个性化的鼠标样式？ - css 笔记

其实所谓的个性化鼠标，就是一个个的图片，用自己喜欢的鼠标样式图片去覆盖默认的鼠标样式就好啦

最后更新于
本页目录2 节

其实所谓的个性化鼠标，就是一个个的图片，用自己喜欢的鼠标样式图片去覆盖默认的鼠标样式就好啦。

这里需要用到 CSS 的 cursor 属性，首先，你需要找到一些有趣的鼠标图片，参考下方代码：

<style type="text/css">
/**普通指针样式  -栖枝perch**/
body{
    cursor:url(./img/default.cur),default;
}
/**链接指针样式 -栖枝perch**/
a:hover{
    cursor:url(./img/pointer.cur),pointer;
}
</style>

如何使用？

点击下方的 Demo 按钮，右击鼠标查看源代码，根据代码注释理解相关含义。

帮助：

演示中仅用了:hover,其实还有很多有趣的鼠标状态，下文有详细介绍：