CSS实现鼠标变化

html-css023

CSS实现鼠标变化,第1张

CSS完全可以做到啊

cursor -- 定义鼠标样式

<style="cursor:url('鼠标图片的网址')">

*{crusor:url('鼠标图片的网址')}

详细介绍:

取值: [ [<uri>,]* [ auto | crosshair | default | pointer | move | e-resize | ne-resize | nw-resize | n-resize | se-resize | sw-resize | s-resize | w-resize | text | wait | help | progress ] ] | inherit

[<uri>,]*: 根据用户定义的资源显示

auto: 正常鼠标

crosshair: 十字鼠标

default: 默认鼠标

pointer: 点状鼠标

move: 移动鼠标

e-resize,ne-resize,nw-resize,n-resize,se-resize,sw-resize,s-resize,w-resize: 改变大小鼠标

text: 文字鼠标

wait: 等待鼠标

help: 求助鼠标

progress: 过程鼠标

inherit: 继承

引用网址:http://www.dreamdu.com/css/property_cursor/

初始值: auto

继承性: 是

适用于: 所有元素

cursor: 中文"鼠标"的意思.

代码最下面加

<STYLE type=text/css>

<!--

body{cursor:url(image/mouse.ani )}

a{cursor:url('**.cur ')}

-->

</STYLE>

说明:

1、( )号中的为你的图标的路径,后缀名还有**.ico的,和**.ani的.

2、第一个路径是鼠标移动时的指针。第二个路径是接触链接时的指针。

后缀名为**.ico 的为静态

后缀名为**.cur 的为静态

后缀名为**.ani 的为动画

鼠标特效example:

01 白色小企鹅 CURSOR: url('http://webme.bokee.com/inc/mouse002.ani')

02 奔跑的狗狗 CURSOR: url('http://webme.bokee.com/inc/mouse009.ANI')

03 蓝色小海豚 CURSOR: url('http://webme.bokee.com/inc/mouse010.ani')

04 正面小提琴 CURSOR: url('http://webme.bokee.com/inc/mouse011.cur')

05 走路的海龟 CURSOR: url('http://webme.bokee.com/inc/mouse012.ani')

06 动态红缨枪 CURSOR: url('http://webme.bokee.com/inc/mouse015.ani')

07 在飞的蝴蝶 CURSOR: url('http://webme.bokee.com/inc/mouse019.ani')

08 静态的莲花 CURSOR: url('http://webme.bokee.com/inc/mouse020.ani')

09 毛笔 CURSOR: url('http://webme.bokee.com/inc/mouse016.ani')

10 铅笔 CURSOR: url('http://webme.bokee.com/inc/mouse017.ani')

其实没什么关系

切片是对于图片来说的 是指把一张大图 切成一小张一小张

把它放在网页的不同位置

不过要说有关系 也有关系

图片要在网页中显示为背景图片,要借助css来实现