鼠标滑过元素显示手型图标

收藏
CSS/CSS3
7
Feb 7, 2018

当鼠标滑过a链接元素的时候,会出现一个小手的状态。但是,当滑过普通的div的时候就没有这个一个效果。

回答

云松回答

问题分析:

a链接标签鼠标滑过显示小手,是a标签默认拥有这歌属性。其实可以通过标签属性cursor:;来自定义鼠标滑过的图形;

解决办法:

给要设定鼠标滑过展示小手的div设定cursor属性,如下所示:

div:hover {cursor:crosshair;}  光标呈现为十字线。
div:hover {cursor:help;}       此光标指示可用的帮助(通常是一个问号或一个气球)。
div:hover {cursor:wait;}    此光标指示程序正忙(通常是一只表或沙漏)。
div:hover {cursor:pointer;}   光标呈现为指示链接的指针(一只手)

值	    描述
url	   需使用的自定义光标的 URL。
注释:请在此列表的末端始终定义一种普通的光标,以防没有由 URL 定义的可用光标。

default	 默认光标(通常是一个箭头)
auto	 默认。浏览器设置的光标。
crosshair	光标呈现为十字线。
pointer	 光标呈现为指示链接的指针(一只手)
move	 此光标指示某对象可被移动。
e-resize	此光标指示矩形框的边缘可被向右(东)移动。
ne-resize	此光标指示矩形框的边缘可被向上及向右移动(北/东)。
nw-resize	此光标指示矩形框的边缘可被向上及向左移动(北/西)。
n-resize	此光标指示矩形框的边缘可被向上(北)移动。
se-resize	此光标指示矩形框的边缘可被向下及向右移动(南/东)。
sw-resize	此光标指示矩形框的边缘可被向下及向左移动(南/西)。
s-resize	此光标指示矩形框的边缘可被向下移动(南)。
w-resize	此光标指示矩形框的边缘可被向左移动(西)。
text	此光标指示文本。
wait	此光标指示程序正忙(通常是一只表或沙漏)。
help	此光标指示可用的帮助(通常是一个问号或一个气球)。

 

(0)

提交成功