css怎么改变鼠标样式
导读:收集整理的这篇文章主要介绍了css怎么改变鼠标样式,觉得挺不错的,现在分享给大家,也给大家做个参考。在css中,可以通过cursor属性来设置鼠标样式,语法格式“cursor:值;”。cursor属性用于规定要显示的光标的类型(形状),可以...
收集整理的这篇文章主要介绍了css怎么改变鼠标样式,觉得挺不错的,现在分享给大家,也给大家做个参考。在css中,可以通过cursor属性来设置鼠标样式,语法格式“cursor:值; ”。cursor属性用于规定要显示的光标的类型(形状),可以设置鼠标指针放在一个元素边界范围内时所用的光标形状。
本文操作环境:Windows7系统、HTML5& & CSS3版,DELL G3电脑
有些时候我们并不想加文字,图片以及链接,却想要加链接时的鼠标样式。这就用到了我们的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视频教程》
以上就是css怎么改变鼠标样式的详细内容,更多请关注其它相关文章!
声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!
若转载请注明出处: css怎么改变鼠标样式
本文地址: https://pptw.com/jishu/588806.html