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

最终结果：

代码：

<!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. NHibernate应用开发

    第一章:NHibernate入门       第一讲:NHibernate架构剖析       第二讲:搭建第一个NHibernate应用程序       第三讲:nhibernate.cfg.xml ...

  2. PAT 天梯赛 L1-045. 宇宙无敌大招呼 【水】

    题目链接 https://www.patest.cn/contests/gplt/L1-045 AC代码 #include <iostream> #include <cstdio&g ...

  3. PAT 天梯赛 L1-001 【水】

    L1-001. Hello World 时间限制 400 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 这道超级简单的题目没有任何输入. 你只需要在一行中输 ...

  4. CodeForces - 220B Little Elephant and Array (莫队+离散化 / 离线树状数组）

    题意:N个数,M个查询,求[Li,Ri]区间内出现次数等于其数值大小的数的个数. 分析:用莫队处理离线问题是一种解决方案.但ai的范围可达到1e9,所以需要离散化预处理.每次区间向外扩的更新的过程中, ...

  5. JSP与Servlet之后台页面单条删除与多条删除的页面跳转之实现

    单条删除页面跳转 1.首先打开JSP页面,找到删除 2.这个时候要把它改成servlet的URL,并决定要传给后台什么数据,例如我需要传一个待删数据的ID id并不是什么见不得人的东西(而且是后台也不 ...

  6. java 标识符

    java 所有的组成部分都需要名字.类名.变量名以及方法名都被称为标识符. java 标识符 1.所有的标识符都应该以字母(A-Z或者a-z),特殊符号(美元符$).或者下划线(_)开始 2.首字母之 ...

  7. 关于使用UniForm以其他控件为Parent时应该注意的问题

    关于使用UniForm以其他控件为Parent时应该注意的问题: 1,不能在其他组件的oncreate,onbeforeshow,onshow等事件中来生成这样的uniform,否则其上的组件不能显示 ...

  8. 分布式技术 webapi

    webapi可以返回json.xml类型的数据,对于数据的增.删.改.成,提供对应的资源操作,按照请求的类型进行相应的处理,主要包括 Get(查).Post(增).Put(改).Delete(删),这 ...

  9. C语言，C#，Java，JavaScript之强类型与弱类型

    奇葩的我今天想到一个坑爹的问题,都说Java是强类型的语言,JavaScript是弱类型的语言. 嗯嗯,那初学时候的C语言呢? 呵呵哒,突然觉得短路了.说Java是强类型的语言是因为遇到这样的情况: ...

  10. ViewPager实现图片的轮播

    在app中图片的轮播显示可以说是非常常见的实现效果了,其实现原理不过是利用ViewPager,然后利用handler每隔一定的时间将ViewPager的currentItem设置为当前item的pos ...