CSS控制鼠标样式变换方法

时间:2007-11-17 07:58:00 

主页上的鼠标是不是就只有箭头和小手两种模样呢?如果鼠标移到“帮助”等字样上时,形状就变成求助的问号;鼠标移到可能需要较长时间等待的超链接时,鼠标形状就变成等待的样子……那该多好啊!

其实,借助我们的css,几句很简单的代码就可以实现这一切!

不信?把鼠标移到下面的演示文字上看看效果吧!

演示:手形

代码:

 <P style="CURSOR: hand">演示:手形</P>


或者


 <P style="CURSOR: pointer">演示:手形</P>


演示:移动

代码:

 <p style=cursor:move>演示:移动</p> 


演示:等待

代码:

 <P style="CURSOR: wait">等待状态</P>


演示:定位指示

代码:

<P style="CURSOR: crosshair">演示:定位指示</P>


演示:帮助

代码:

<P style="CURSOR: help">演示:帮助<P>


是不是简单又方便?这里我们只用到了CSS中的“cursor”属性,利用“style=cursor:值”这样的语句形式,分别设置具体的就可以了。例如:值为“hand”时,当鼠标移到相应的文字或图片上时,就会变成超链接的小手形;值为“move”时,当鼠标移到相应的文字或图片上时,就会变成上下左右带方向箭头的形状,依此类推。这个小技巧也许可以在你制作主页时帮上一点忙呢!

文章推荐:css2中文手册

标签:鼠标,样式,css
0
投稿

猜你喜欢

  • asp程序定义变量比不定义变量速度快一倍

    2012-12-04 20:06:32
  • 简单实用的图片播放器1.0(Javascript + css )

    2008-07-16 10:39:00
  • WEB页面工具语言XML应用分类之运用

    2008-05-29 10:58:00
  • ORCLE 表中列的修改

    2009-07-28 10:42:00
  • 分析Silverlight Button控件布局

    2009-02-17 13:13:00
  • 如何快速定位页面中复杂 CSS BUG 问题

    2009-01-15 12:23:00
  • firefox 2正则表达式

    2008-08-25 19:15:00
  • 简单的淡入淡出图片轮换效果

    2009-05-22 18:38:00
  • IBatis.net连接MySql 问题与故障的解决方案

    2011-06-02 09:38:00
  • 德国ebay购头记

    2009-04-29 11:10:00
  • 教你在MySQL 5.0以上版本中配置主从库

    2009-01-04 13:17:00
  • Logo 设计准则[译]

    2009-07-22 21:05:00
  • ASP网站程序自动升级实现的方法

    2008-10-15 14:28:00
  • 想用户所想(感受亚马逊的设计)

    2007-08-26 17:09:00
  • 70+漂亮且极具亲和力的导航菜单设计推荐[译]

    2009-02-23 13:15:00
  • 请正确认识MySQL对服务器端光标的限制

    2008-12-17 14:58:00
  • ASP也使用ORM,给ASP上所有的SQL注入画上句号

    2011-04-03 11:02:00
  • OverFlow – 一个秘密武器

    2010-09-25 12:51:00
  • 采用手动分页方式显示文章具体的内容

    2009-10-29 11:58:00
  • MySQL错误中文参照列表

    2010-09-30 14:41:00
  • asp之家 网络编程 m.aspxhome.com