CSS之cursor属性_html/css_WEB-ITnose
程序员文章站
2022-04-15 10:53:37
...
CSS之cursor属性
今天学习了CSS的cursor属性,第一篇博客就用来总结它吧。
cursor属性用于控制光标的显示样式,可取的值有这些:
cursor:url()*|{auto|default|pointer|crosshair|text|vertical-text|help|not-allowed|no-drop|move|e-reszie|s-resize|w-resize|w-resize|n-resize|all-scroll|ne-resize|se-resize|nw-resize|sw-resize|col-resize|row-resize|}
*表示至少写一个该值,url后面可再选{}内的一个值。
1 2 3 4 5CSS之cursor属性 6 34 35 36 百度37指示和选择光标
38auto:浏览器默认
39default:操作系统默认光标
40hand:手型
41text:大写的I,水平文本选择
42vertical-text:大写的I,垂直文本选择
43help:箭头加问号,获取帮助
44pointer:手形,表示链接
45not-allowed:红色圆圈和斜杠,禁止操作
46no-drop:红色圆圈和斜杠,无法释放
47crosshair:十字瞄准,表示精确选择
48
49表程序状态
50wait:选转环,表示等待直到不忙,不能交互
51progress:箭头加旋转环,处理中,可以交互
52 53
54move用于移动对象
55move:移动对象,两端带箭头的十字
56all-scroll:移动
57在四个角上改变窗口大小
58ne-resize:向东(右)或/和北(上)
59sw-resize:向西(左)或/和南(下)
60nw-resize:向西(左)或/和北(上)
61se-resize:向东(右)或/和南(下)
62
63在四条边上改变窗口大小
64东西用于改变水平宽度
65e-resize:向东(右)
66w-resize:向西(左)
67南北用于改变垂直高度
68s-resize:向南(下)
69n-resize:向北(上)
70col-resize:改变列宽
71row-resize:改变行高
72 73
还有几个属性值没有弄清楚:hand url col-resize row-resize 弄清楚了再在修改博客。
第一次写博客,各种不熟悉。学的也不够扎实,欢迎指正。
推荐阅读
-
HTML5之tabindex属性全面解析
-
前端笔记之微信小程序(一)初识微信小程序&WXSS与CSS|WXML与HTML的差异&像素和DPR
-
前端笔记知识点整合之HTML5&CSS3(上)新特性&音频视频&本地存储
-
css3学习系列之移动属性详解
-
CSS3之边框多颜色Border-color属性使用示例
-
HTML5实战与剖析之字符集属性(charset和defaultCharset)
-
有关html的标签以及css属性(border、div)
-
前端笔记知识点整合之jQuery(一)加载函数的区别&对象&操作HTML/CSS&动画&选择器
-
HTML5实战与剖析之CSS选择器——querySelectorAll()
-
浅谈JS对html标签的属性的干预以及对CSS样式表属性的干预