这篇文章主要介绍了css如何换鼠标样式,具有一定借鉴价值,需要的朋友可以参考下。希望大家阅读完这篇文章后大有收获。下面让小编带着大家一起了解一下。
鼠标样式常见的如箭头或小手形状,除此之外,我们可以根据我们自身的要求,使用css中cursor属性来更改鼠标光标的外观。
推荐学习:《CSS教程》
下面我们就给大家介绍鼠标光标的不同样式。
代码如下:
<!DOCTYPE> <html> <meta charset="utf-8"> <head> <title></title> </head> <body> <a href=# style=cursor:crosshair;>十字准线</a><hr> <a href=# style=cursor:text;> text </a><hr> <a href=# style=cursor:wait;>等待的形状</a><hr> <a href=# style=cursor:move;>移动的形状</a><hr> <a href=# style=cursor:help;>帮助的形状</a><hr> <a href=# style=cursor:default;>默认的形状</a><hr> <a href=# style=cursor:hand;>小手状</a> </body> </html>
上述代码,大家可以复制到本地进行测试,当鼠标悬停在每个超链上,就会显示更改不同的光标样式。
十字线样式:
文本编辑时样式:
等待样式:
移动样式:
帮助样式:
默认箭头样式:
小手样式:
cursor 属性规定要显示的光标的类型(形状)。该属性定义了鼠标指针放在一个元素边界范围内时所用的光标形状(不过 CSS2.1 没有定义由哪个边界确定这个范围)。
感谢你能够认真阅读完这篇文章,希望小编分享css如何换鼠标样式内容对大家有帮助,同时也希望大家多多支持亿速云,关注亿速云行业资讯频道,遇到问题就找亿速云,详细的解决方法等着你来学习!
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。