<html>

<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:pointer">
Pointer</span><br />
<span style="cursor:move">
Move</span><br />
<span style="cursor:e-resize">
e-resize</span><br />
<span style="cursor:ne-resize">
ne-resize</span><br />
<span style="cursor:nw-resize">
nw-resize</span><br />
<span style="cursor:n-resize">
n-resize</span><br />
<span style="cursor:se-resize">
se-resize</span><br />
<span style="cursor:sw-resize">
sw-resize</span><br />
<span style="cursor:s-resize">
s-resize</span><br />
<span style="cursor:w-resize">
w-resize</span><br />
<span style="cursor:text">
text</span><br />
<span style="cursor:wait">
wait</span><br />
<span style="cursor:help">
help</span>
</body> </html>

定义和用法

cursor 属性规定要显示的光标的类型(形状)。

该属性定义了鼠标指针放在一个元素边界范围内时所用的光标形状(不过 CSS2.1 没有定义由哪个边界确定这个范围)。

默认值: auto
继承性: yes
版本: CSS2
JavaScript 语法: object.style.cursor="crosshair"

可能的值

描述
url

需使用的自定义光标的 URL。

注释:请在此列表的末端始终定义一种普通的光标,以防没有由 URL 定义的可用光标。

default 默认光标(通常是一个箭头)
auto 默认。浏览器设置的光标。
crosshair 光标呈现为十字线。
pointer 光标呈现为指示链接的指针(一只手)
move 此光标指示某对象可被移动。
e-resize 此光标指示矩形框的边缘可被向右(东)移动。
ne-resize 此光标指示矩形框的边缘可被向上及向右移动(北/东)。
nw-resize 此光标指示矩形框的边缘可被向上及向左移动(北/西)。
n-resize 此光标指示矩形框的边缘可被向上(北)移动。
se-resize 此光标指示矩形框的边缘可被向下及向右移动(南/东)。
sw-resize 此光标指示矩形框的边缘可被向下及向左移动(南/西)。
s-resize 此光标指示矩形框的边缘可被向下移动(南)。
w-resize 此光标指示矩形框的边缘可被向左移动(西)。
text 此光标指示文本。
wait 此光标指示程序正忙(通常是一只表或沙漏)。
help 此光标指示可用的帮助(通常是一个问号或一个气球)。

css属性cusor的更多相关文章

  1. 通过设置CSS属性让DIV水平居中

    通过设置CSS属性让DIV水平居中 ---------------------- <html> <head> <title></title> <m ...

  2. 换行的css属性

    //正常换行  word-break:keep-all;word-wrap:normal; //下面这行是自动换行  word-break:break-all;word-wrap:break-word ...

  3. jquery css属性练习

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. animate支持的css属性

    支持下列CSS 样式 * backgroundPosition * borderWidth * borderBottomWidth * borderLeftWidth * borderRightWid ...

  5. css属性的选择对动画性能的影响

    现在手机的占比越来越高,各种酷炫页面层出不穷,这些特效都离不开css动画.说到css动画,主流的情况也就无非这两大类:位移和形变.而我们在写一个动画特效的过程中,如何去提升它的性能呢?当然首先我们需要 ...

  6. CSS中浏览器开发商特定的CSS属性

    浏览器制造商(像Microsoft.Mozilla等,还有WebKit的后台人员等)通常会为他们的浏览器增加新的功能来测试新的特性, 或者实现一直在考虑但还没有得到标准组织批准的CSS扩展.在这些情况 ...

  7. css学习(2)-- 常见的CSS属性和值

    1.CSS中修饰字体的属性 属    性 描    述 属  性  值 font-family 字体族科 任意字体族科名称都可以使用例如Times.serif等,而且多个族科的赋值是可以使用的,中间用 ...

  8. css属性编写顺序+mysql基本操作+html细节(个人笔记)

    css属性编写顺序: 影响文档流的属性(比如:display, position, float, clear, visibility, table-layout等) 自身盒模型的属性(比如:width ...

  9. 前端开发--css属性书写顺序

    css属性顺序是css良好编码风格的一部分,有助于提高代码可读性,便于发现代码问题,有利于团队合作.(依次排后) example { /*显示属性*/ display: ; visibility: ; ...

随机推荐

  1. mongoose中的流查询stream query

    mongoose中的流查询stream query,功能类似于php中的mysql_fetch_array,每次从集合中获取一条记录(文档) var cursor = Person.find({ oc ...

  2. Java多线程和并发基础

    第一:Java多线程面试问题 1:进程和线程之间有什么不同? 一个进程是一个独立(self contained)的运行环境,它可以被看作一个程序或者一个应用.而线程是在进程中执行的一个任务.Java运 ...

  3. angular学习笔记(五)-阶乘计算实例(2)

    <!DOCTYPE html> <html ng-app> <head> <title>2.3.3计算阶乘实例2</title> <m ...

  4. bazel-编译静态库

    demo3 使用bazel编译静态库 demo3目录树 ├── README.md ├── static │ ├── BUILD │ ├── static.c │ └── static.h └── W ...

  5. 每日英语:Why Food Companies Are Fascinated by the Way We Eat

    Are you a cruncher? Or a 'smoosher'? cruncher:咬嚼者,咬碎 Some people crave the perfectly crispy crunch o ...

  6. canvas相关api

    1.线性径变:ctx.createLinearGradient(): var grd=ctx.createLinearGradient(0,0,170,0); grd.addColorStop(0,' ...

  7. strcat

    将两个char类型链接. char d[20]="GoldenGlobal"; char *s="View"; strcat(d,s); 结果放在d中 prin ...

  8. JAVA-MyEclipse第一个实例

    相关资料: <21天学通Java Web开发> 实例代码: MyEclipse第一个实例1.打开MyEclipse程序.2.在PacKage视图->右击->New|Web Pr ...

  9. 使用 LocalReport 对象进行打印

    添加引用   从“项目”菜单中,选择“添加引用”.将显示“添加引用”对话框. 从“.NET”选项卡上显示的列表框中,选择 Winforms 和 Drawing 组件. 添加代码 应打开 Program ...

  10. Bootstrap3.0 栅格系统背后的精妙魔法(Bootstrap3.0的栅格布局系统实现原理)

    这个标题取的有点奇怪,怪我翻译的有问题吧.英文学平有限,有道词典和google翻译齐上阵是必须的.还好翻译的不是小说,对于技术文章,还是能勉强翻过来的. 本文主要讲解了Bootstrap3.0的栅格布 ...