CSS-自定义鼠标图标

html-css0147

CSS-自定义鼠标图标,第1张

解析:前面的url是自定义鼠标图标的路径,可以为相对/绝对路径。第二个参数是css标准的cursor样式。可换成其他属性(如pointer/crosshair/default/等)

注意:w3school推荐第二个参数必须定义一个普通的光标,以防止url定义的光标有备用选项。另外,IE下第二个参数可以省略。

自定义鼠标图标,需要注意以下几点:

① 图标的格式

IE支持cur,ani,ico这三种格式,FF支持bmp,gif,jpg,cur,ico这几种格式,不支持ani格式,也不支持gif动画格式,因此一般将url引用的图标存为ico或cur格式比较好。

② 图标的大小

鼠标图标的尺寸推荐32*32,否则可能出现大小不一致问题。

参考文章: 使用自定义的鼠标图标

=w=,三个方法……

一:把ul或li 中的行高删掉。

二:修改图片,把那红色的画下一点,可做成gif透明图(如原本图为:16*16,可画成:16*21,红色部分在最底部。)。

三:去掉list-style-image属性,改为在li 中用 background 属性

如:

ul{list-style:none}

li{padding-left:18pxbackground:url(pot.gif) no-repeat left 5px}

以上……

1.Auto 鼠标指针会显示默认的样式

2.Crosshair 鼠标指针会显示"+"\

3.Point 鼠标指针会显示"手"形图标

4.Wait 鼠标指针会显示"圆形的" 旋转图标

5.其余的属性不是很常用

6.cursor的javaScript 语法