记录一次给hexo博客自定义鼠标样式

制作鼠标样式文件

鼠标样式文件一般有两种格式cur和ico
后者编辑较为方便,所以我选择了制作ico格式的鼠标样式文件

寻找样式图片

首先要找到自己想要作为鼠标样式的图片,例如我这个
图片要尽量简单,不要有太多细节,因为ico的分辨率仅为32x32
1

转换为ico

最方便的是通过在线转换工具直接转换,也可以使用ps
我这一次使用了 aconvert 在线转换
这里我们选择分辨率为32x32
2
转换下载即可

去背景

这一步想必不用多说了,去掉底色,使图标透明
这里我使用了 简易图标制作工具 进行编辑

请注意,这是一个易语言程序,在我对该工具进行检测时有报毒现象,详见 s.threatbook.cn
请自我甄别,如果担心请在虚拟机运行

下载 : https://dl-cdn.feizhuqwq.com/blog/icozhizuo.7z

增加CSS样式

以next为例,我们需要编辑 hexo项目文件夹/themes/next/source/css/main.styl
中添加以下代码

1
2
3
4
5
6
* {
cursor: url("https://c0-cdn.feizhuqwq.com/ico/pigcur.ico"),auto!important
}
:active {
cursor: url("https://c0-cdn.feizhuqwq.com/ico/pigcur.ico"),auto!important
}

3

本文作者 : 肥猪qwq 转载请注明出处