We can use CSS cursor properties to manipulate the cursor images of different elements in HTML documents.
The syntax of CSS cursor property is as follows: Selector { cursor: /*value*/ }
The following are the values of the CSS cursor property-
Sr.No | Value and description< /th> |
---|---|
1 | alias Indicates an alias for something to be created
|
2 | Full scroll It represents content that can be scrolled in any direction |
3 | Auto Default, the browser sets the cursor |
Cell< /p> means you can select a cell (or a group of cells) | |
context-menu< strong>Indicates that the context menu is available | |
col-resizeIndicates that the column can be resized horizontally | |
CopyIndicates the content to be copied | |
It is rendered as a crosshair | |
Default | It renders the default cursor |
e-resize | means resize the box The edge of td> |
ew-resize | means Adjust the cursor size in both directions
|
Grab | Indicates that things can be grabbed |
Grab | means that something can be grabbed< p> |
Help | means helpful< p> |
Move | means to move something |
n-resize | means the edge of the box will move up (north) |
ne-resize | Indicates that the edge of the box should be moved up and to the right (North/East) |
new-resize | means adjusting the cursor size in both directions | ##19
ns-resize td> | Indicates bidirectional adjustment of the cursor size | 20
nw-resize | means the edge of the box moves up and to the left (north/west) ##21 |
Indicates bidirectional resizing cursor 22 | |
means that the dragged item cannot be dragged and dropped here 23 | |
No cursor is rendered for element 24 | |
It means that the requested action will not be executed 25 | |
It is a pointer, representing a link ##26 | |
represents The program is busy (in progress) | p> ##27 | row- resize
indicates that Rows can be resized vertically | 28
| s-resize
means moving the edges of the box Move down (south) | 29 | se-resize
represents the box Edge moves down and to the right (south/east) | 30< /p> | sw-resize
Indicates that a border should be moved downward and left (south/west) | ##31 Text |
strong>32 URL | |
< /strong>33 vertical-text | |
34 w-resize | |
35 p> Wait | |
##36 < /p>Enlarge | |
37Zoom out | |
38Initial | |
39Inheritance | |
The following is an example of implementing CSS cursor propertiesExample | Live demonstration