在 IE 下设置鼠标为手型的方法: cursor: hand,但是在 FIREFOX 中是无效的,解决方法是在FIREFOX中设置: cursor: pointer.

而这个pointer 值在IE和FIREFOX 下都是通用的,所以我们使用: cursor:pointer 就可以了。

　　一般而言，鼠标以斜向上的箭头显示，移到文本上时变为有头的竖线，移到超级链接上变为手型。

但用css可控制鼠标的显示效果，如可使鼠标移到普通文本上也显示成手型。

　　用css控制的语法如下:

　html：

<!DOCTYPE HTML>
<html>

   <head>
      <meta charset="utf-8">
      <title>无标题文档</title>
      <style>

      </style>
   </head>
   <body>
      <div style="width: 100px;height: 100px;background:rgb(245, 17, 157);cursor:pointer;">

      </div>
   </body>
</html>

result：

aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHAAAABxCAIAAACC3rC5AAAA8klEQVR4nO3QsQnDAAADQa/g/cmYqZ0+lSECP+HEDyDuuGy64+kD/zag4wEdD+h4QMcDOt436Pt86WZAgbYDCrQdUKDtgAJtBxRoO6BA2wEF2g4o0HZAgbYDCrQdUKDtgAJtBxRoO6BA2wEF2g4o0HZAgbYDCrQdUKDtgAJtBxRoO6BA2wEF2g4o0HZAgbYDCrQdUKDtgAJtBxRoO6BA2wEF2g4o0HZAgbYDCrQdUKDtgAJtBxRoO6BA2wEF2g4o0HZAgbYDCrQdUKDtgAJtBxRoO6BA2wEF2g4o0HZAgbYD+gSo/Tig4wEdD+h4QMcDOt4Hmwz1kxvC2SwAAAAASUVORK5CYII=" alt="" />

　　15个效果:

　　hand、crosshair、text、wait、default、help、e-resize、ne-resize、n-resize、nw-resize、w-resize、sw-resize、s-resize、se-resize和auto。

　　下面是对这15种效果的解释。移动鼠标到解释上面，看看你的鼠标起了什么变化吧!

　　hand，pointer是手型

　　crosshair是十字型

　　text是移动到文本上的那种效果

　　wait是等待的那种效果

　　default是默认效果

　　help是问号

　　e-size是向右的箭头

　　ne-resize是向右上的箭头

　　n-resize是向上的箭头

　　nw-resize是向左上的箭头

　　w-resize是向左的箭头

　　sw-resize是左下的箭头

　　s-resize是向下的箭头

　　se-resize是向右下的箭头

　　auto是由系统自动给出效果

CSS属性中cursor:hand的更多相关文章

  1. CSS属性中Display与Visibility的不同

    大多数人很容易将CSS属性display和visibility混淆,它们看似没有什么不同,其实它们的差别却是很大的.visibility属性用来确定元素是显示还是隐藏,这用visibility=&qu ...

  2. CSS属性中display="none“与visibility="hidden"的不同

    display="none",元素会从页面移除,不在页面占用位置,当某个元素设置为display="none"时,这个元素后面的元素会移动上来 visibili ...

  3. CSS属性中的display属性浅谈；

    首先我们要知道什么是块级元素和行内元素有什么区别: 承接上篇文章:(浅谈HTML和body标签) 块级元素:浏览器解析为独占一行的元素(例如:div.table.ul等.),浏览器会在该元素的前后显示 ...

  4. DIV CSS布局中position属性用法深入探究

    本文向大家描述一下DIV CSS布局中的position属性的用法,position属性主要有四种属性值,任何元素的默认position的属性值均是static,静态.这节课主要讲讲relative( ...

  5. DIV css中cursor属性详解-鼠标移到图片变换鼠标形状 (转)

    css中cursor属性详解-鼠标移到图片变换鼠标形状   语法: cursor : auto | all-scroll | col-resize| crosshair | default | han ...

  6. CSS中cursor属性给标签加上小手形状

    HTML/CSS 2012-08-10 CSS,标签 我们发现a标签在网页中有一个值得注意的地方,即鼠标移到a标签上光标会变成一只小手的图标,移出a标签后又恢复为默认箭头. 如今,JS在网页中的功能越 ...

  7. CSS中cursor的pointer 与 hand（转）

    CSS中cursor的pointer 与 hand 转载 2015年12月25日 16:18:36 标签: cursorpointer / cursorhand 1781 cursor:hand 与 ...

  8. cursor CSS属性定义鼠标指针悬浮在元素上时的外观。

    1 1 cursor CSS属性定义鼠标指针悬浮在元素上时的外观. https://developer.mozilla.org/zh-CN/docs/Web/CSS/cursor 概述 cursor  ...

  9. css鼠标手型cursor中hand与pointer

    css鼠标手型cursor中hand与pointer Example:CSS鼠标手型效果 <a href="#" style="cursor:hand"& ...

随机推荐

  1. HDU暑假多校第八场J-Taotao Picks Apples

    一.题意 给定一个序列,之后给出若干个修改,修改的内容为在原序列的基础上,将某一位元素的值改成给定的值<每次修改相互独立,不保存修改后的结果>.之后询问,在选择第一位元素的情况下,最长递增 ...

  2. struts2官方 中文教程 系列十：Form标签

    介绍 在本教程中,我们将探索其他Struts 2表单控件.在前面的教程中,我们介绍了如何使用Struts 2表单(处理表单.表单验证和消息资源文件),我们介绍了如何使用Struts 2 head, f ...

  3. EF报错“EntityValidationErrors”

          在使用EF更新实体的时候报错,显示界面如下:       点击查看详情:        在查看详细的窗体中,EntityValidationErrors里面的也看不到具体的错误原因.在网上 ...

  4. 【多线程】 Task

    [多线程] Task 一. 常用方法: 1. ContinueWith : 当前 Task 完成后, 执行传入的 Task 2. Delay : 创建一个等待的 Task,只有在调用 Wait 方法时 ...

  5. DDD领域驱动设计基本理论知识总结（转）

    领域驱动设计之领域模型 为什么建立一个领域模型是重要的 领域通用语言(UBIQUITOUS LANGUAGE) 将领域模型转换为代码实现的最佳实践 领域建模时思考问题的角度 领域驱动设计的经典分层架构 ...

  6. tomcat 异常

    Removing obsolete files from server... Could not clean server of obsolete files: null java.lang.Null ...

  7. 基于阿里云服务器Linux系统部署JavaWeb项目

    前段时间刚完成一个JavaWeb项目,想着怎么部署到服务器上,边学边做,花了点时间终于成功部署了,这里总结记录一下过程中所遇到的问题及解决方法.之所以选择阿里云,考虑到它是使用用户最多也是最广泛的云服 ...

  8. 杀死 tomcat 进程的脚本

    新建一个.sh 文件 把下面的内容复制进去.然后 把这个文件放到tomcat 的bin目录下在关闭tomcat 执行这个脚本. 可以解决 在关闭tomcat的时候 总是遗留一些tomcat进程没有结束 ...

  9. jmeter无法启动的解决办法

    jmeter下载地址: 链接: https://pan.baidu.com/s/15YhiPH-kNVxISEZ4Mxf_WA     提取码: 25sv jdk 8.0 下载地址: 链接: http ...

  10. 【app.js】配置及App函数说明

    app.js中的App函数用来注册一个小程序或设置全局变量. App函数: 语法:App(Object)     参数: Object json对象     说明: App函数必须在app.js中调用 ...