网站美化：鼠标样式自定义

2018年1月14日21:29:51 5 7,471 °C
摘要

个人网站的鼠标也是可以自定义的。

网站美化：鼠标样式自定义

一、前言

个人网站的鼠标也是可以自定义的。

本站使用的鼠标样式有两种，一个用于正常状态显示，一个用于链接状态显示。效果如下图所示：

网站美化：鼠标样式自定义

二、代码部署

可以看到，鼠标颜色是变化的，其实这个就是两个样子一样，颜色不同的图片而已。

然后在style.css中增加以下代码，知更鸟主题的用户可以添加到外观->主题设置->定制风格->自定义样式里面。

CSS
1
2
3
4
5
6
7
8
/** 鼠标样式 开始**/
/** 普通指针样式**/
body {
cursor: url(http://cuijiahua.com/xxx/cursor_1.png), default;
}
/** 链接指针样式**/
a:hover{cursor:url(http://cuijiahua.com/xxx/cursor_2.png), pointer;}
/** 鼠标样式 结束**/

将上述两个链接换成自己的鼠标样式图标即可，我使用的鼠标图片在文末可以自行下载。

本人收集的还有自己制作的一些图标分享给大家，欢迎自取。

网站美化：鼠标样式自定义

三、总结

鼠标图标可以根据自己喜好进行选择。

文件下载 Jack Cui鼠标样式收集+自制作
下载地址
weinxin
微信公众号
分享技术，乐享生活：微信公众号搜索「JackCui-AI」关注一个在互联网摸爬滚打的潜行者。
Jack Cui

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

目前评论：5   其中：访客  4   博主  1

    • avatar bee 来自天朝的朋友 谷歌浏览器 Windows 10 江苏省无锡市 电信 0
      回复 2019年1月10日 下午1:31  沙发

      学习了

        • avatar Jack Cui Admin 来自天朝的朋友 谷歌浏览器 Android 8.0.0 MIX 2 Build/OPR1.170623.027 黑龙江省哈尔滨市 联通
          回复 2019年1月10日 下午3:21  1层

          @bee 感谢支持～

        • avatar NHYAYN 来自天朝的朋友 谷歌浏览器 Windows 10 江苏省连云港市 移动 0
          回复 2019年10月11日 下午2:54  板凳

          学习了，我也去搞一下~

          • avatar 依风 来自天朝的朋友 谷歌浏览器 Windows 10 黑龙江省哈尔滨市 电信 1
            回复 2021年1月7日 下午7:39  地板

            转下蓝奏云呗

            • avatar 依风 来自天朝的朋友 谷歌浏览器 Windows 10 黑龙江省哈尔滨市 电信 1
              回复 2021年1月7日 下午7:52  4楼

              补一下呗