CSS cursor disabled

This article is about how to make a disabled cursor in CSS and what is the use of a disabled cursor.

What is a cursor?

It is our mouse controller. There are different types of mouse cursor are available in CSS, but the most used cursor is a pointer. And automatically change according to each element eg text cursor for text, pointer cursor for a link, etc.

Syntax of changing cursor in CSS

cursor:default;

CSS cursor property is used to change the mouse cursor. In the above code, the cursor property is set to default which means the default cursor is applied. If you don’t know the value of the cursor property check this website to know.

CSS cursor disabled

a{ 
cursor: not-allowed | no-drop;
 }

To disable the cursor you need to set the CSS cursor property to “not-allowed” or “no-drop” as shown in the above code. If you disable the cursor and click on the link, it will go into the link and you can also select the text and copy it.

Cursor pointer:

<button style="cursor:pointer;" > Submit</button>

By default cursor is normal for a button, we need to give the value “pointer” to change it to a pointer as shown in the above code. But the <a> tag has a default cursor value of “cursor”, so you don’t need to change the cursor value.