语法:cursor : auto | all-scroll | col-resize| crosshair | default | hand | move | help | no-drop | not-allowed | pointer | progress | row-resize | text | vertical-text | wait | *-resize | url ( url ) 取值:

auto : 默认值。浏览器根据当前情况自动确定鼠标光标类型。all-scroll : IE6.0有上下左右四个箭头,中间有一个圆点的光标。用于标示页面可以向上下左右任何方向滚动。col-resize : IE6.0有左右两个箭头,中间由竖线分隔开的光标。用于标示项目或标题栏可以被水平改变尺寸。crosshair : 简单的十字线光标。default : 客户端平台的默认光标。通常是一个箭头。hand : 竖起一只手指的手形光标。就像通常用户将光标移到超链接上时那样。move : 十字箭头光标。用于标示对象可被移动。help : 带有问号标记的箭头。用于标示有帮助信息存在。no-drop : IE6.0带有一个被斜线贯穿的圆圈的手形光标。用于标示被拖起的对象不允许在光标的当前位置被放下。not-allowed : IE6.0禁止标记(一个被斜线贯穿的圆圈)光标。用于标示请求的操作不允许被执行。pointer : IE6.0和 hand 一样。竖起一只手指的手形光标。就像通常用户将光标移到超链接上时那样。progress : IE6.0带有沙漏标记的箭头光标。用于标示一个进程正在后台运行。row-resize : IE6.0有上下两个箭头,中间由横线分隔开的光标。用于标示项目或标题栏可以被垂直改变尺寸。text : 用于标示可编辑的水平文本的光标。通常是大写字母 I 的形状。vertical-text : IE6.0用于标示可编辑的垂直文本的光标。通常是大写字母 I 旋转90度的形状。wait : 用于标示程序忙用户需要等待的光标。通常是沙漏或手表的形状。*-resize : 用于标示对象可被改变尺寸方向的箭头光标。w-resize | s-resize | n-resize | e-resize | ne-resize | sw-resize | se-resize | nw-resizeurl ( url ) : IE6.0用户自定义光标。使用绝对或相对 url 地址指定光标文件(后缀为 .cur 或者 .ani )。

说明:设置或检索在对象上移动的鼠标指针采用的光标形状。
此属性的值可以是多个,其间用逗号分隔。假如第一个值不可以被客户端系统理解或所指定的光标无法找到及显示,则第二个值将被尝试使用。依此类推。假如全部值都不可用的话,则此属性不会发生作用。光标不会被改变。
此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
对应的脚本特性为 cursor 。示例:p { cursor: text; }
a { cursor: pointer; }
body { cursor: url("mycursor.gif"), url("images/cursors/footcursor.jpg"), default; }

把你的光标放到相应文字上鼠标显示效果

注意光标的实际效果依赖于用户的系统设置,与你在这里看到的效果不一定完全一致。

cursor: auto;

自动

The browser sets a cursor

浏览器设置一个游标

cursor:all-scroll;

上下左右任何方向滚动

IE6.0有上下左右四个箭头,中间有一个圆点的光标。用于标示页面可以向上下左右任何方向滚动。

cursor: crosshair;

十字准心

The cursor render as a crosshair

游标表现为十字准线

cursor: pointer;

cursor: hand;

写两个是为了照顾IE5,它只认hand。

The cursor render as a pointer (a hand) that indicates a link

游标以暗示(手指)的形式来表明有一个连接

cursor: wait;

等待/沙漏

The cursor indicates that the program is busy (often a watch or an hourglass)

游标暗示当前程序正忙(一般为一块表或是一个沙漏)

cursor: help;

帮助

The cursor indicates that help is available (often a question mark or a balloon)

游标暗示当前位置可得到帮助(一般为问号或是气球)

cursor: no-drop;

无法释放

cursor: no-drop;

cursor: text;

文字/编辑

The cursor indicates text

游标暗示当前所处位置为文字内容

cursor: move;

可移动对象

The cursor indicates something that should be moved

游标暗示一些东西应该被移动

cursor:vertical-text

可编辑的垂直文本的光标

IE6.0用于标示可编辑的垂直文本的光标。通常是大写字母 I 旋转90度的形状。

cursor: n-resize;

向上改变大小(North)

The cursor indicates that an edge of a box is to be moved up (north)

边缘可向上移动(北)

cursor: s-resize;

向下改变大小(South)

The cursor indicates that an edge of a box is to be moved down (south)

边缘可向下方移动(南)

cursor: e-resize;

向右改变大小(East)

The cursor indicates that an edge of a box is to be moved right (east)

box边缘可向右(东)边移动

cursor: w-resize;

向左改变大小(West)

The cursor indicates that an edge of a box is to be moved left (west)

边缘可向左移动(西)

cursor: ne-resize;

向上右改变大小(North East)

The cursor indicates that an edge of a box is to be moved up and right (north/east)

游标暗示box的边缘可向右上方移动(东北方向)

cursor: nw-resize;

向上左改变大小(North West)

The cursor indicates that an edge of a box is to be moved up and left (north/west)

边缘可向左上方移动(西北)

cursor: se-resize;

向下右改变大小(South East)

The cursor indicates that an edge of a box is to be moved down and right (south/east)

边缘可向右下方移动(东南)

cursor: sw-resize;

向下左改变大小(South West)

The cursor indicates that an edge of a box is to be moved down and left (south/west)

边缘可向左下方移动(西南)

cursor:col-resize;

项目可被水平改变尺寸

IE6.0有左右两个箭头,中间由竖线分隔开的光标。用于标示项目或标题栏可以被水平改变尺寸。

cursor:row-resize;

项目可被垂直改变尺寸

IE6.0有上下两个箭头,中间由横线分隔开的光标。用于标示项目或标题栏可以被垂直改变尺寸。

cursor:not-allowed;

禁止

cursor:not-allowed;

cursor: progress;

处理中

cursor: progress;

cursor: default;

系统默认

The default cursor (often an arrow)

默认的游标状态(通常为一个箭头)

cursor: url(' # ');

# = 光标文件地址      (注意文件格式必须为:.cur 或 .ani)。

用户自定义(可用动画)

The url of a custom cursor to be used.

自定义游标的url位置

Note: Always define a generic cursor at the end of the list in case none of the url-defined cursors can be used

注意:在定义完自定义的游标之后在末尾加上一般性的游标,以防那些url所定义的游标不能使用

但要说明一点:cursor: hand不符合标准,所以如果希望是手型的话还是用cursor: pointer比较好。

HTML中常用鼠标样式的更多相关文章

  1. web中自定义鼠标样式

    实现一个功能:鼠标移动到一个图片左边显示左箭头,移动到右边显示右箭头. 实现方法:一个img上面定位两个div,div的样式如下: .toleft { width: 200px; height: 30 ...

  2. 工作中常用css样式总结

    一.HTML隐藏文本输入框 有三种方法: 1.<input type="hidden" value=""> 这是对任何元素都起作用的: 2.< ...

  3. CSS中的鼠标样式明细

    <INPUT   TYPE="submit"   style="cursor:   hand"   value="hand">  ...

  4. css字体文本格式 鼠标样式

    缩进 text-indent 属性规定文本块中首行文本的缩进.(允许使用负值.如果使用负值,那么首行会被缩进到左边.) length 定义固定的缩进.默认值:0.% 定义基于父元素宽度的百分比的缩进. ...

  5. bootstrap课程3 bootstrap中常用的排版样式有哪些

    bootstrap课程3 bootstrap中常用的排版样式有哪些 一.总结 一句话总结:bootstrap里面对常用表情比如p.h1.code等html中的常用表情都修改了样式,照着手册用就好,样式 ...

  6. Wpf中鼠标样式的修改,作用点修改

    最近,在做一个控件的鼠标样式,Ps加了插件,可以编辑生成.cur格式的图标. 可是,所有的改完以后,调试运行,结果发现自己制作的图标的作用点总是在左上角,而不是在"手形"图标的食指 ...

  7. C#、WPF中如何自定义鼠标样式

    需求:在C#中如何自定义鼠标样式?在这里可以分两种情况,一种是在winForm,另一种是在WPF中(注意使用的Cursor对象不一样) 解决办法如下: a.首先针对WinForm中,我们可以采用图标加 ...

  8. html中的一些常用的样式标签

    html中的一些常用的样式标签 <p>这里是文本,<mark>高亮</mark></p> <strong>加粗,加重语气</stron ...

  9. wxpython中鼠标样式的获取与匹配

    在wxpython中定义有多种默认的鼠标样式,譬如:wx.CURSORCROSS wx.CURSORHAND等等, 此处按下不表,可以参考wxpython的samples里面自带的cursor例子 这 ...

随机推荐

  1. 浅谈MIPS地址对齐问题

    1.什么叫地址对齐? RISC 下使用访存指令读取或写入数据单元时,目标地址必须是所访问之数据单元字节数的整数倍,这个叫做地址对齐. 2.计算机主要的架构分哪两类?及其地址对齐在两者的区别? 计算机主 ...

  2. Autodesk 开源 3D 打印机

    Autodesk 开源 3D 打印机 Autodesk在知识共享-署名-相同方式共享许可证下公开了其3D打印机Ember的树脂.机械设计.电路图纸的细节,在GNU GPL许可证下公开了固件.打印机运行 ...

  3. COJN 0584 800603吃糖果

    800603吃糖果 难度级别:B: 运行时间限制:1000ms: 运行空间限制:51200KB: 代码长度限制:2000000B 试题描述 名名的妈妈从外地出差回来,带了一盒好吃又精美的巧克力给名名( ...

  4. 【转】ubuntu打包压缩命令总结

    原文网址:http://blog.csdn.net/renero/article/details/6428523 .tar解包:tar xvf FileName.tar打包:tar cvf FileN ...

  5. (转载)php中实现定时执行计划任务方法

    (转载)http://www.111cn.net/phper/php/41216.htm PHP脚本执行时间限制,默认的是30m 解决办法:set_time_limit();或者修改PHP.ini 设 ...

  6. 【贪心+堆】XMU 1584 小明的烦恼

    题目链接: http://acm.xmu.edu.cn/JudgeOnline/problem.php?id=1584 题目大意: 给n(n<=100 000)个任务的耗时和截至时间,问最少不能 ...

  7. Delphi TcxTreeList 读取 TcxImageComboBoxItem类型的值

    Delphi  TcxTreeList 读取  TcxImageComboBoxItem类型的值: Node.Values[wiNodeLevel.ItemIndex]://值 Node.Texts[ ...

  8. 2013=11=12 SQL 实验

    --22. 查询选修课程成绩至少有一门在80分以上的学生学号: select distinct sno from sc where grade>80 go --23. 查询选修课程成绩均在80分 ...

  9. jquery实现停留半秒后再选择

    jquery实现tab停留半秒后,选中菜单.切换tab下的内容: var showHandler=null; function init(){ $("#tab_ul").find( ...

  10. python学习笔记(集合的使用)

    集合 集合(set):把不同的元素组成一起形成集合,是python基本的数据类型. 集合元素(set elements):组成集合的成员 为什么需要集合? 集合的作用 1 .列表去重复数据 按照现有知 ...