现在的位置: 首页 > web前端 > 正文

CSS 鼠标样式有什么

2020年07月09日 web前端 ⁄ 共 769字 ⁄ 字号 评论关闭

  我们在DIVCSS布局时候,我们会遇到对对象内鼠标指针光标进行控制,比如鼠标经过指针变为手指形状等样式,接下来我们介绍鼠标指针样式cursor控制。系统默认鼠标指针样式外,可以通过CSS设置图片为鼠标指针,常见有些网站鼠标指针是各种各样小图片样式,当然这个是通过csscursor设置鼠标样式。


  Csscursor鼠标指针样式


  cursor语法:


  cursor:auto|crosshair|default|hand|move|help|wait|text|w-resize|s-resize|n-resize|e-resize|ne-resize|sw-resize|se-resize|nw-resize|pointer|url(url)


  常用cursor光标说明


  1)、div{cursor:default}默认正常鼠标指针


  2)、div{cursor:hand}和div{cursor:text}文本选择效果


  3)、div{cursor:move}移动选择效果


  4)、div{cursor:pointer}手指形状链接选择效果


  5)、div{cursor:url(url图片地址)}设置对象为图片


  鼠标指针样式有哪些


  鼠标指针样式控制设置是比较常用的,比如日常我们在DIV+CSS布局时候,我们希望鼠标指向某个局部span标签对象时候,鼠标指针光标就变为手指状态,这个时候我们就对对象span设置cursor:pointer即可。以上我们图例展示常用的鼠标光标形状与css单词,希望布局时候更加自身需要选择设置鼠标指针样式。需要注意是,光标切记勿滥用,也不要轻易设置自定义图片为鼠标样式这样会将网页造成复杂与不符合用户体验感觉,切记光标慎用。


  总之,鼠标指针样式给大家简单的介绍了一些,希望大家多看看。

抱歉!评论已关闭.