CSS光标的各个形状总结验证

2025-05-28 03:29:05

1、我们来新建一个div，div大小为200px的正方形区域，背景颜色为红色，具体代码如下：<html> <head> <title>鼠标形状</title> <style> div{ background-color:red; width:200px; height:200px; } </style> </head> <body> <div></div> </body></html>可以看到默认的情况下鼠标是箭头形状的。

3、还有一个常用的光标是转圈或者漏斗状态的，表示需要等待的光标，具体代码如下：<html> <head> <title>鼠标形状</title> 艘早祓胂 <style> div{ background-color:red; width:200px; height:200px; cursor:wait; } </style> </head> <body> <div></div> </body></html>具体执行效果图如下，可以看到光标的外形变成了一个不停旋转的圆圈了。

5、我们在可拖动的窗口中经常会遇到一个箭头加十字的形状的一个光标，具体代码如下：<html> <head> <title>鼠标形状</title> <style> div{ background-color:red; width:200px; height:200px; cursor:move; } </style> </head> <body> <div></div> </body></html>如下，可以看到具体的效果图。

声明：本网站引用、摘录或转载内容仅供网站访问者交流或参考，不代表本站立场，如存在版权或非法内容，请联系站长删除，联系邮箱：site.kefu@qq.com。