这篇文章主要介绍CSS如何改变鼠标样式,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!在css中,可以通过cursor属性来设置鼠标样式,语法格式“cursor:值;”。cursor属性用于规定要显示的光标的类型(形状
这篇文章主要介绍CSS如何改变鼠标样式,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!
在css中,可以通过cursor属性来设置鼠标样式,语法格式“cursor:值;”。cursor属性用于规定要显示的光标的类型(形状),可以设置鼠标指针放在一个元素边界范围内时所用的光标形状。
有些时候我们并不想加文字,图片以及链接,却想要加链接时的鼠标样式。这就用到了我们的css中的cursor来设置鼠标指针形状。
cursor属性规定要显示的光标的类型(形状)。该属性定义了鼠标指针放在一个元素边界范围内时所用的光标形状。
下面就是鼠标指针cursor属性的一些属性值:
实例:
<!DOCTYPE html><html><head><meta charset="utf-8"> <title></title> </head><body><p>请把鼠标移动到单词上:</p><span style="cursor:auto">auto</span><br><span style="cursor:crosshair">crosshair</span><br><span style="cursor:default">default</span><br><span style="cursor:e-resize">e-resize</span><br><span style="cursor:help">help</span><br><span style="cursor:move">move</span><br><span style="cursor:n-resize">n-resize</span><br><span style="cursor:ne-resize">ne-resize</span><br><span style="cursor:nw-resize">nw-resize</span><br><span style="cursor:pointer">pointer</span><br><span style="cursor:progress">progress</span><br><span style="cursor:s-resize">s-resize</span><br><span style="cursor:se-resize">se-resize</span><br><span style="cursor:sw-resize">sw-resize</span><br><span style="cursor:text">text</span><br><span style="cursor:w-resize">w-resize</span><br><span style="cursor:wait">wait</span><br></body></html>
这样鼠标就变成我们需要的了。
说明:
还有一种用法其原理是:利用了CSS2
的一个cursor
的属性cursor:url (url)
,鼠标文件可以使用jpg
、gif
、ani
和cur
多种文件格式。需要注意的这种方式只能在IE5.5
以上浏览器中正常显示。
以上是“css如何改变鼠标样式”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注编程网精选频道!
--结束END--
本文标题: css如何改变鼠标样式
本文链接: https://www.lsjlt.com/news/269913.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
下载Word文档到电脑,方便收藏和打印~
2024-05-16
2024-05-16
2024-05-16
2024-05-16
2024-05-16
2024-05-16
2024-05-16
2024-05-16
2024-05-16
2024-05-16
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
0