您的位置:首页网页设计HTML/CSS  → 入门学习:运用CSS样式表来改变鼠标的样式

入门学习:运用CSS样式表来改变鼠标的样式

时间:2007/6/3 21:09:00来源:本站整理作者:我要评论(0)

入门学习:运用CSS样式表改变鼠标的样式


用惯了Windows的人对各种各样的鼠标样式一定不会陌生。当鼠标移动到不同的地方时,当鼠标执行不同的功能时,当系统处于不同的状态时,都会使鼠标的形状发生变化。而在网页上往往只有当鼠标在超级链接上时才出现一个手形,在其它地方似乎没有什么变化。这同充满动感的网页显得不怎么和谐。实际上,用CSS可以方便地定义许多种鼠标形状。用本文介绍的方法,可以在网页的作何地方设置鼠标的不同样式。


  在Dreamweaver3中设置手形鼠标样式效果的制作步骤:


  1、按F7(或点击快速启动栏里那个象“八卦图”似的图标),调出CSS面板,选择“none”,再点击面板下部的编辑图标,在弹出的“Edit Style Sheet”对话框上按“New”按钮,在弹出的“New Style”对话框中选择“Make Custom Style (加到网页的源代码中去才行。


  若要把鼠标改变成其它形状,只要在第二步中定义“cursor”属性时选择不同的样式就行了。各属性值的含义如下:


crosshair:精确定位“十”字形;
text:文本“I”形;
wait:等待,“沙漏”形;
default:默认指针;
help:帮助,带尾箭头;
e-resize:箭头朝右方;
ne-resize:箭头朝右上方;
n-resize:箭头朝上方;
nw-resize:箭头朝左上方;
w-resize:箭头朝左方;
sw-resize:箭头朝左下方;
s-resize:箭头朝下方;
se-resize箭头朝右下方;
auto:自动,鼠标按照默认的状态根据页面上的元素自行改变样式。


  了解了上述属性值的含义,鼠标的形状就在你的掌握之中了,需要让鼠标在那里变为什么形状,只要重复上面的操作就行了。要注意的是:一次只能定义一种鼠标样式,若在一个页面上使用多种样式的鼠标图形,要定义多个“class",用时选择加载。

相关视频

    没有数据

相关阅读 个性化jQuery和CSS3菜单源码CSS实现Tab技巧CSS复位-CSS Reset代码举例IE6绝对定位的bug及其解决办法CSS样式表创建美妙绝伦的网站几个最常用和实用的CSS技巧将网站(主页)变成黑白DW设计网页时组织CSS的建议

文章评论
发表评论

热门文章 没有查询到任何记录。

最新文章 页面进入效果表单 XHTML校验需要注意的6个细节CSS样式表创建美妙绝伦的网站了解XHTML DHTML SHTML之间的区别HTML小技巧的一些小技巧

人气排行 容易被误解的overflow:hiddenCSS中dashed和dotted的区别CSS水平和垂直居中的几种实现方法DIV+CSS自适应高度兼容IE6,ie7,ie8和FF的解css优先级问题如何用CSS实现图片圆角化处理超链接target=_blank的使用方法Ctrl+H键的用法