要显示手,大家可以将cursor属性设置为”pointer”。
button { cursor: pointer; } a { cursor: pointer; }
在上面的代码中,大家将显示手应用到了按钮和链接上。当鼠标悬停在这些元素上时,它们将显示手形状,提示用户可以点击它们。
注意,如果你发现你的CSS中并没有把所有按钮和链接都设置为显示手,你可以通过以下代码来统一设置:
* { cursor: pointer; }
上述代码将把鼠标的形状设置为显示手,应用到网页上的所有元素,这也包括文字和图片等其他元素。
在移动端设备上,由于没有鼠标,大家可以通过设置类似于触摸的样式来代替显示手。下面的代码可以使元素在移动设备上被点击时,显示一个灰色半透明的背景色:
button, a { -webkit-tap-highlight-color: rgba(0,0,0,0.1); }
这使得用户在手机上点击元素时可以有一个视觉上的反馈,提高了用户体验。