在前端开发中,很多时候需要对页面的某些元素做鼠标样式的处理,比如button一般用pointer , 文本区一般用text......等等。

今天咱就来聊聊 这个经常用到的 cursor 属性

cursor默认值auto(默认浏览器设置的光标。也就是空白区 箭头,文本区 I字形, 超链接/按钮 手型)

cursor的所有值

值 光标说明
default 系统默认光标
crosshair 十字光标
pointer(hand)IE5只认hand 手型光标
wait 等待光标(win7是个圈圈)
 help 帮助光标 
 no-drop 无法释放 
 text I型光标 
 move  移动光标
 n-resize   /   s-resize

这两个值的光标都长这样

(官方解释,n-向上(北)移动,s-向下移(南)动)

 e-resize    /     w-resize

 同上解释,e-向左(东) ,w-向右(西)

 ne-resize   /    sw-resize  同上解释,ne-向右上(东北) ,sw-向下左(西南)
 nw-resize  /   se-resize  同上解释,nw-向上左(西北) ,se-向下右(东南)
 not-allowed 禁止光标 
 progress  繁忙光标

最后说明下cursor: url(' # ');这个值,亲自测试过只有IE下才有效,firefox chrome Opera均不支持。

上一张firefox给出的报错,url值被丢弃了。

聊聊 cursor鼠标样式的更多相关文章

  1. [CSS]cursor鼠标样式

     用css控制鼠标样式的语法如下: <span style="cursor:*">文本或其它页面元素</span>  把 * 换成如下15个效果的一种:   ...

  2. cursor 鼠标样式——属性

    取值: [ [<uri> ,]* [ auto | crosshair | default | pointer | move | e-resize | ne-resize | nw-res ...

  3. 原来cursor:可以这样改变鼠标样式

    前言:今天看百度的一个layui前端框架的时候,看到一个禁用图标的样式,鼠标移上去会变成一个自定义的图片样式,就在想难道cursor也可以自定义图片路径?!之前一直没有使用过. 使用了一下之后,遇到很 ...

  4. 使用CSS为内容设定特定的鼠标样式(cursor)介绍

    相信大家都知道我们的鼠标在网页中不同的元素中有不同的显示(例如 a 元素就显示为“箭头指针”),但是其实我们还可以自定义这些有趣的东西哦!今天“畅想资源”就来教大家如何使用CSS为内容设定特定的鼠标样 ...

  5. CSS鼠标样式 cursor 属性

    值 描述 url 需使用的自定义光标的 URL. 注释:请在此列表的末端始终定义一种普通的光标,以防没有由 URL 定义的可用光标. default 默认光标(通常是一个箭头) auto 默认.浏览器 ...

  6. 【css】cursor鼠标指针光标样式知识整理

    在前端开发中,我们经常需要对对象鼠标指针光标进行控制,比如鼠标经过超链接时变成手指形状.在这里整理一下cursor鼠标指针光标样式的知识,记录与方便以后查找. 1.常用cursor光标 div( cu ...

  7. cursor -- 定义鼠标样式

    cursor -- 定义鼠标样式 取值: [ [<uri> ,]* [ auto | crosshair | default | pointer | move | e-resize | n ...

  8. cursor url 自定义鼠标样式

    cursor可以自定义鼠标,写法是cursor:url(“图片路径”),pointer; url:需使用的自定义光标的 URL.图片类型需要是.cur或.ani和jpg,png等格式的(.cur或.a ...

  9. C#开发分享:如何改变系统鼠标样式

    开发过程中发现需要用到改变鼠标样式(就是光标的样子),但是在网上找了很多资料,都是介绍在程序中使用,我需要的效果时在系统级使用.现在找到了,分享给大家. [DllImport("user32 ...

随机推荐

  1. C# Json数组序列化和反序列总结

    1.创建json数组,例: JArray arrFile = new JArray(); arrFile.Add(new JObject() { new JProperty("FilePat ...

  2. linux mv命令详解

    Linux mv命令 Linux mv命令用来为文件或目录改名.或将文件或目录移入其它位置. 用法: mv [选项]... [-T] 源文件 目标文件 mv [选项]... 源文件... 目录 mv ...

  3. oracle rac的启动与停止

    引言:这写篇文章的出处是因为我的一名学生最近在公司搭建RAC集群,但对其启动与关闭的顺序和原理不是特别清晰,我在教学工作中也发现了很多学员对RAC知识了解甚少,因此我在这里就把RAC里面涉及到的最常用 ...

  4. LibreOffice转换文档到pdf时中文乱码

    根据我的测试,LibreOffice转换文档到pdf乱码主要有三个方面的原因: 1.centos缺少中文字体 2.jdk缺少中文字体 3.LibreOffice缺少中文字体. 解决该问题需要将wind ...

  5. nodeJS安装及npm设置淘宝镜像

    node.js安装 下载node.js安装包:https://nodejs.org/en/download/,下载相应版本的node.js. 需注意,在window中,node的安装目录中,最好不要有 ...

  6. 【IntelliJ 】IntelliJ IDEA 2017激活码

    CNEKJPQZEX-eyJsaWNlbnNlSWQiOiJDTkVLSlBRWkVYIiwibGljZW5zZWVOYW1lIjoibGFuIHl1IiwiYXNzaWduZWVOYW1lIjoiI ...

  7. 【spring boot】映射properties文件属性--到Java对象

    描述 将*.properties中的内容映射到java对象中: 主要步骤 添加 @Component 注解: 使用 @PropertySource 注解指定配置文件位置: 使用 @Configurat ...

  8. [Easyui - Grid]为easyui的datagrid、treegrid增加表头菜单,用于显示或隐藏列

    为easyui的datagrid.treegrid增加表头菜单,用于显示或隐藏列 /** * @author 孙宇 * * @requires jQuery,EasyUI * * 为datagrid. ...

  9. PAT 乙级 1036 跟奥巴马一起编程(15) C++版

    1036. 跟奥巴马一起编程(15) 时间限制 400 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 CHEN, Yue 美国总统奥巴马不仅呼吁所有人 ...

  10. springboot(二 如何访问静态资源和使用模板引擎,以及 全局异常捕获)

    在我们开发Web应用的时候,需要引用大量的js.css.图片等静态资源. 默认配置 Spring Boot默认提供静态资源目录位置需置于classpath下,目录名需符合如下规则: /static / ...