网站首页 工具软件 操作系统 办公软件 网页制作 PHP教程 script脚本专栏 photoshop教程 其他精品教程
我发布的文章 - 教程搜索 - 交流论坛 - 帮助中心 - 网站首页 网络工具 - 常用工具 - 媒体工具 - 系统工具 - 实用工具 NT/2003 - Win Xp - Win2000 - DOS/Win9x - IE/注册表 - Linux - 苹 果 Office - Word - Excel - PowerPoint - 输入法 - 邮件处理 Flash - Dreamweaver - Fireworks - FrontPage - HTMLCSS 基础文章 - PHP函数 - PHP技巧 - 数据库相关 - 高级应用 - PHP安装 - 转载精华 - 常见问题 综 合 类 - 状 态 栏 - 游 戏 类 - 页面背景 - 页面特效 - 页面导航 - 文本操作 - 文本特效 - 图形特效 - 鼠标特效 - 时间日期 - 密 码 类 文字特效 - 按钮与图标 - 色彩运用 - 滤镜魔法 - 综合实例 XML教程 - DELPHI基础教程 - VB教程
首页 -> 网页制作 -> HTMLCSS

TOP

巧用CSS控制鼠标样式变换
文章内容
相关信息
用户评论
文章内容
    主页上的鼠标是不是就只有箭头和小手两种模样呢?如果鼠标移到“帮助”等字样上时,形状就变成求助的问号;鼠标移到可能需要较长时间等待的超链接时,鼠标形状就变成等待的样子……那该多好啊!


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

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


演示:手形

源代码:<P style="CURSOR: hand">演示:手形</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”时,当鼠标移到相应的文字或图片上时,就会变成上下左右带方向箭头的形状,依此类推。这个小技巧也许可以在你制作主页时帮上一点忙呢!


相关信息
巧用CSS控制鼠标样式变换
发布者:lfj
浏览量:187
发布日期:2005-03-08 13:37:39
所属专题:
用户评论
称  呼:
内  容:

广告位

广告招租,欢迎抢订

热门信息

·从HTML语言到网上家园 第一..
·从HTML语言到网上家园 第二..
·从HTML语言到网上家园 序章
·从HTML语言到网上家园 第三..
·从HTML语言到网上家园 第五章
·HTML:让网页超链接拥有多..
·个人网站制作全接触(中)
·个人网站制作全接触(下)

推荐信息