Home >Web Front-end >CSS Tutorial >Example of using CSS to implement a tornado using custom cursor styles
Example of using CSS to implement a tornado using custom cursor styles
- 高洛峰Original
- 2017-03-04 10:00:431559browse
The test environment is the chrome browser
Mozilla/5.0 (Windows NT 6.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.132 Safari/537.36
css Style
p
{
cursor:url('1.jpg'),pointer;
}
HTML
<body>
<p style="width:100px;height:100px;background-color:red;"></p>
</body>When the mouse is placed on p, the cursor will change into the pattern you specified
*Notes
Make sure the customized picture is small enough, here is 16*16
Different browsers support different image formats, please search by yourself
cursor:url('1.jpg'),pointer;The 1.jpg here must be the same as the current html The file is in the same level directory, and pointer is necessary. It is a backup plan when the customized picture cannot be applied. It would be wrong not to write it in this test.
The implementation of the above CSS using custom cursor styles_Escape tornado is all the content shared by the editor. I hope it can give you a reference, and I also hope that everyone will support the PHP Chinese website.
For more related articles on examples of CSS using custom cursor styles to achieve an underground tornado, please pay attention to the PHP Chinese website!