在页面布局时,css是工作中必不可少的部分,常听别人讲:html是一个人素颜的样子,加了css后是一个人化妆以后的样子。这句话通俗易懂,很好的诠释了css与html之间的关系。css中的属性非常多,今天就着重讲一个属性,即css cursor属性,以及它的很多可选值,比如:cursor 手型 就是用的 cursor:pointer 这个属性。
cursor怎么用?
一、CSS cursor 基本语法
cursor属性是什么:指鼠标指针放在一个元素边界范围内时所呈现的光标形状,它包括问号,小手等形状。
使用时可以在任何你想要添加的标签里,插入style=”cursor : 某属性值” ,也可以在CSS样式中添加。
比如:
pointer,小手形状
立即学习“前端免费学习笔记(深入)”;
, help,帮助形状 。
cursor的属性值有十几种可选值,在工作中根据需要选择合适的值即可。
二、CSS cursor 属性值
1、最常用的cursor:pointer,光标呈现小手形状。
pointer
2、cursor:help,问号光标
pointer
3、cursor:crosshair,十字架光标
pointer
就详细介绍常用的这几个,其他的属性值都是一样的写法,只要改一改属性值就行,具体有哪些值,他们都代表什么意思,请看下面。
default :默认光标,通常是一个箭头
auto :默认,浏览器设置的光标
crosshair :光标表示十字线
pointer :光标表示指示链接的指针(一只手)
move: 光标表示对象可被移动
e-resize: 光标表示矩形框的边缘可被向右移动
ne-resize:光标表示矩形框的边缘可被向上及向右移动
nw-resize:光标表示矩形框的边缘可被向上及向左移动
n-resize: 光标表示矩形框的边缘可被向上移动
se-resize:光标表示矩形框的边缘可被向下及向右移动
sw-resize:光标表示矩形框的边缘可被向下及向左移动
s-resize: 光标表示矩形框的边缘可被向下移动
w-resize:光标表示矩形框的边缘可被向左移动
text :光标表示文本
wait :光标表示程序正忙(通常是一只表或沙漏)
help: 光标表示帮助(通常是一个问号)
以上主要介绍了CSS中cursor属性的用法,以及不同属性值代表的意思,初学者可以在编辑器中试试不同的值,看看有什么样的效果,希望可以帮助到你。
以上就是cursor怎么用?CSS中cursor属性的使用方法以及可选值的解析的详细内容,更多请关注创想鸟其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1611684.html
微信扫一扫
支付宝扫一扫