今天早上在网上看到一篇关于光标类型的总结代码，很好，特定拿来：

最终结果：

代码：

<!DOCTYPE html>

<html lang="zh-cn">

<head>

    <meta charset="utf-8" />

    <title>cursor光标类型</title>

    <style>

        .test{width:400px;border-collapse:collapse;font:14px/1.5 georgia,arial,serif,sans-serif;}

        .test td{padding:2px 10px;border:1px solid #ddd;}

        .test td:hover{background:#eee;}

        .auto{cursor:auto;}

        .default{cursor:default;}

        .none{cursor:none;}

        .context-menu{cursor:context-menu;}

        .help{cursor:help;}

        .pointer{cursor:pointer;}

        .progress{cursor:progress;}

        .wait{cursor:wait;}

        .cell{cursor:cell;}

        .crosshair{cursor:crosshair;}

        .text{cursor:text;}

        .vertical-text{cursor:vertical-text;}

        .alias{cursor:alias;}

        .copy{cursor:copy;}

        .move{cursor:move;}

        .no-drop{cursor:no-drop;}

        .not-allowed{cursor:not-allowed;}

        .e-resize{cursor:e-resize;}

        .n-resize{cursor:n-resize;}

        .ne-resize{cursor:ne-resize;}

        .nw-resize{cursor:nw-resize;}

        .s-resize{cursor:s-resize;}

        .se-resize{cursor:se-resize;}

        .sw-resize{cursor:sw-resize;}

        .w-resize{cursor:w-resize;}

        .ew-resize{cursor:ew-resize;}

        .ns-resize{cursor:ns-resize;}

        .nesw-resize{cursor:nesw-resize;}

        .nwse-resize{cursor:nwse-resize;}

        .col-resize{cursor:col-resize;}

        .row-resize{cursor:row-resize;}

        .all-scroll{cursor:all-scroll;}

        .url{cursor:url(skin/cursor.gif),

        url(skin/cursor.png),

        url(skin/cursor.jpg),

        pointer;}

    </style>

</head>

<body>

<table class="test">

    <caption>cursor光标类型</caption>

    <tbody>

    <tr>

        <td class="auto">auto</td>

        <td class="default">default</td>

        <td class="none">none</td>

        <td class="context-menu">context-menu</td>

        <td class="help">help</td>

        <td class="pointer">pointer</td>

        <td class="progress">progress</td>

    </tr>

    <tr>

        <td class="wait">wait</td>

        <td class="cell">cell</td>

        <td class="crosshair">crosshair</td>

        <td class="text">text</td>

        <td class="vertical-text">vertical-text</td>

        <td class="alias">alias</td>

        <td class="copy">copy</td>

    </tr>

    <tr>

        <td class="move">move</td>

        <td class="no-drop">no-drop</td>

        <td class="not-allowed">not-allowed</td>

        <td class="e-resize">e-resize</td>

        <td class="n-resize">n-resize</td>

        <td class="ne-resize">ne-resize</td>

        <td class="nw-resize">nw-resize</td>

    </tr>

    <tr>

        <td class="s-resize">s-resize</td>

        <td class="se-resize">se-resize</td>

        <td class="sw-resize">sw-resize</td>

        <td class="w-resize">w-resize</td>

        <td class="ew-resize">ew-resize</td>

        <td class="ns-resize">ns-resize</td>

        <td class="nesw-resize">nesw-resize</td>

    </tr>

    <tr>

        <td class="nwse-resize">nwse-resize</td>

        <td class="col-resize">col-resize</td>

        <td class="row-resize">row-resize</td>

        <td class="all-scroll">all-scroll</td>

        <td class="url">url</td>

    </tr>

    </tbody>

</table>

</body>

</html>

cursor光标类型的更多相关文章

  1. 鼠标放上去，不同的cursor光标类型

    <!DOCTYPE html><html lang="zh-cmn-Hans"><head><meta charset="utf ...

  2. CSS display overflow 属性 cursor光标类型

    display属性   功能:规则网页元素如何显示的问题.   取值:none(隐藏).block(以块元素显示).inline(以行内元素显示)   block:可以实现将行内元素转成块元素.   ...

  3. css中cursor(光标类型)

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

  4. 常用cursor光标说明

    1.cursor语法: cursor : auto | crosshair | default | hand | move | help | wait | text | w-resize |s-res ...

  5. C++:CursorType光标类型 和 LockType锁定类型

    简要: CursorType光标类型: 1.   AdOpenForwardOnly   (默认值)一次只能向前移动一行. 2.   AdOpenKeyset   打开键集类型游标. 3.   AdO ...

  6. 用图片替代cursor光标样式

    鼠标光标样式有限,可参考http://css-cursor.techstream.org/,自定义光标样式可用设置cursor:url('xxx.cur'),auto;.还有一种办法,就是用图片替代鼠 ...

  7. 光标显示样式 css 中 cursor 属性使用

    记录一下 cursor 的各种样式,方便自己查找.之前用到不常用的每次去 百度 或 Google 找不如自己记录下好找些. cursor光标类型 auto default none context-m ...

  8. cursor属性

    cursor光标类型 auto default none context-menu help pointer progress wait cell crosshair text vertical-te ...

  9. css cursor效果图

    效果图: <!DOCTYPE html> <html lang="zh-cmn-Hans"> <head> <meta charset=& ...

随机推荐

  1. 连接postgresql

    # psycopg2 engine=create_engine('postgresql+psycopg2://scott:tiger@localhost/mydatabase')#  python 连 ...

  2. js高级---js运行原理

    概述 浏览器组成可分两部分:Shell+内核.浏览器内核又可以分成两部分:渲染引擎(layout engineer或者Rendering Engine)和JS引擎.渲染引擎功能作用 渲染引擎,负责对网 ...

  3. HDU 4292 Food (拆点最大流)

    题意:N个人,F种食物,D种饮料,给定每种食物和饮料的量.每个人有自己喜欢的食物和饮料,如果得到自己喜欢的食物和饮料才能得到满足.求最大满足的人数. 分析:如果只是简单地N个人选择F种食物的话可以用二 ...

  4. 存在单点故障的namenode宕机恢复测试

    前提:如果namenode没有做HA,那么至少应该启用secondarynamenode,以便namenode宕机之后手动恢复数据 实验环境:3个节点(cenos 6.10) 测试前数据: 1.为了确 ...

  5. 使用John the ripper工具来尝试破解Linux密码

    这篇文章主要介绍了使用John the ripper工具来尝试破解Linux密码的方法,这款工具可能主要被用来破解系统用户的密码以获得文件操作权限,需要的朋友可以参考下 John有别于Hdra之类的工 ...

  6. fabric查看本地与远程主机信息

    #!/usr/bin/pythonfrom fabric.api import *env.user='root'env.hosts=['172.10.224.183','172.10.224.132' ...

  7. ngnix进阶

    ngnix进阶 nginx: [warn] duplicate MIME type "text/html" in /usr/local/nginx/conf/nginx.conf: ...

  8. AtCoder Regular Contest 095

    AtCoder Regular Contest 095 C - Many Medians 题意: 给出n个数,求出去掉第i个数之后所有数的中位数,保证n是偶数. \(n\le 200000\) 分析: ...

  9. 正则表达式【TLCL】

    grep[global regular expression print] print lines matching a pattern grep [options] regex [file...] ...

  10. windchill系统——一些功能查找

    1.创建产品 导航栏的浏览——>最近的产品——>全部查看——>新建产品——>填写“名称”.选择“模板”.一定的“说明”.“专用访问权限”一般选择“否”——>“确定”选项 ...