ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

CSS 鼠标样式

2019-02-01 15:00:47  阅读:250  来源: 互联网

标签:CSS 鼠标 样式 指示 矩形框 边缘 resize 移动 光标


设置鼠标指针放在一个元素边界范围内时所用的光标形状,需要对元素的css属性cursor进行设置。

cursor属性可能的值:

  • default 默认光标(通常是一个箭头)

  • auto 默认。浏览器设置的(user agent stylesheet)光标。

  • crosshair 光标呈现为十字。

  • pointer 光标呈现为指示链接的指针(一只小手)

  • move 此光标指示某对象可被移动(带箭头的十字)。

  • e-resize 此光标指示矩形框的边缘可被向右(东)移动。

  • ne-resize 此光标指示矩形框的边缘可被向上及向右移动(北/东)。

  • nw-resize 此光标指示矩形框的边缘可被向上及向左移动(北/西)。

  • n-resize 此光标指示矩形框的边缘可被向上(北)移动。

  • se-resize 此光标指示矩形框的边缘可被向下及向右移动(南/东)。

  • sw-resize 此光标指示矩形框的边缘可被向下及向左移动(南/西)。

  • s-resize 此光标指示矩形框的边缘可被向下移动(南)。

  • w-resize 此光标指示矩形框的边缘可被向左移动(西)。

  • text 此光标指示文本。

  • wait 此光标指示程序正忙(通常是一只表或沙漏,或者一个圈在那转)。

  • help 此光标指示可用的帮助(通常是一个问号或一个气球)。

要实现鼠标移上去显示手形、需要在你的提交按钮上增加css cursor属性,并将它的值设置为pointer;
<input type="button" value="确定" style="cursor:pointer;" />

 

标签:CSS,鼠标,样式,指示,矩形框,边缘,resize,移动,光标
来源: https://www.cnblogs.com/WEB-PHP/p/10345854.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有