自定义网站光标的图案

晚上没啥事,就四处逛了些个人博客。然后发现很多博客网站的光标都是采用的自定义的图案。于是我也就跟一把风。把自己博客的光标图案换掉了。就是加几句CSS语句就OK啦!

body {
  cursor: url('http://source.hongxuelin.com/cursor.ico'), auto;
}
a:hover {
  cursor: url('http://source.hongxuelin.com/cursor_point.ico'), auto;
}
button {
  cursor: url('http://source.hongxuelin.com/cursor_point.ico'), auto;
}

第一个body下的就是全局光标替换那个图标,然后a.hover就是触碰到a标签就换图标,button同理。

cursor还有很多属性,http://www.w3school.com.cn/cssref/pr_class_cursor.asp


因为采用了七牛云镜像,CSS文件刷新很慢= =折腾了一段时间。加载的主题CSS文件地址是这个:http://source.hongxuelin.com/usr/themes/next/css/main.css?v=1.2.1
对后面的?v=1.2.1很是苦恼= =。百度一波才明白是来辅助刷新缓存的。
然后一番折腾,改成了?v=1.2.3才彻底把CSS文件更新过来。
最后的效果还是蛮不错的。

添加新评论