码迷,mamicode.com
首页 > Web开发 > 详细

[CSS揭秘]鼠标光标

时间:2017-05-28 18:04:11      阅读:265      评论:0      收藏:0      [点我收藏+]

标签:one   copy   指针   center   resize   控件   css   鼠标   元素   

鼠标指针可以用来告诉用户当前可以执行什么动作

目前已有的内置光标种类有:

crosshair help move pointer progress text wait e-resize
ne-resize nw-resize n-resize se-resize sw-resize s-resize w-resize none
context-menu cell vertical-text alias copy no-drop not-allowed ew-resize
ns-resize nesw-resize nwse-resize col-resize row-resize all-resize zoom-in

zoom-out

 

介绍几种常用光标

1. 提示禁用状态

not-allowed用于提示某个控件因为某种原因无法进行交互,常常用于表单

:disabled, [disabled], [aria-disabled=‘true‘]{

  cursor: not-allowed;

}

 

2. 隐藏鼠标光标

比如公共场所的信息查询台,娱乐平台需要合适的隐藏鼠标光标,带来可用性提升。

video{

  cursor: none;

}

 

3. 缩放光标

现在提供了几种新的缩放光标,分别是 ew-resize, ns-resize, nesw-resize, nwse-resize

常常用于自定义缩放元素的边界上

[CSS揭秘]鼠标光标

标签:one   copy   指针   center   resize   控件   css   鼠标   元素   

原文地址:http://www.cnblogs.com/joyjoe/p/6916047.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!