Customizing the Website Mouse Cursor

Foreword

Hey, I'm back. Recently I have midterm exams and my studies are pretty busy, so articles won't be posted as eagerly. Please understand, thanks! Today I'm going to show everyone how to change the cursor style of a website!

Explanation

First, let's analyze this piece of CSS code.

default refers to the default mouse cursor style, meaning that whenever you wander around aimlessly with your mouse on my page, this style is displayed!

pointer indicates that when you hover over something executable, clickable, or interactive, this style will be shown!

That's the basics. Once you know these fundamentals, you can search online for other cursor styles and swap them in yourself! Giving someone a fish is not as good as teaching them how to fish, right!

Also, remember: do not use .ani format cursor styles!

Code

 body {
	cursor: url(//cdn.hap5.top/site/typecho/2.cur), default;
}

a:hover {
	cursor: url(//cdn.hap5.top/site/typecho/1.cur), pointer;
}

Just change the link after url. // indicates a protocol-relative link: if your site is opened over HTTP, the file source link will also use HTTP, and the same goes for HTTPS! 88