现在的位置: 首页 >> 网页设计 >> CSS >> 巧用CSS控制鼠标样式变换
添加时间:2005-8-14 来源:网教中国 作者:
巧用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实例:横线样式的输入框 下一篇:有关表格边框的css语法整理
大部分文章摘自网上,如有侵犯您的权益请与我们联系,我们会第一时间进行处理,谢谢! [ 打印文章 ] [ 关闭窗口 ]
推荐文章
·利用CSS改善网站可访问性
·用CSS控制网页总体风格
·DropShadow属性、Chroma属性和bl
·CSS字型的设定
·CSS应用基础教程(1) 基本认识
·为打印输出创建一个CSS样式
·WEB设计中CSS样式表应用小技巧十
·XHTML+CSS的静态页面实现多风格
·实例详解CSS滤镜(5)DropShadow属
·实例详解CSS滤镜(10)Xray属性
相关文章
 
最新文章
·CSS制作11种风格不同的特效文字
·利用CSS改善网站可访问性
·显示/隐藏引出的CSS Bug
·网页技巧之怎样编写CSS
·CSS快速入门
·有关表格边框的css语法整理
·CSS实例:横线样式的输入框
·巧用CSS滤镜做图案文字
·CSS自定义属性Expression
·CSS控制字体效果的思考
Google