Css鼠标移动变小手 pointer

最新推荐文章于 2024-07-08 09:04:23 发布

小玄飞

最新推荐文章于 2024-07-08 09:04:23 发布

阅读量655

点赞数 1

文章标签： css

本文链接：https://blog.csdn.net/xxfeitop/article/details/104756780

版权

本文详细介绍了CSS中的cursor属性，展示了如何使用不同的光标样式来增强用户体验。从auto到not-allowed，每个光标样式的含义及应用场景都得到了充分的解释。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
</head>
<body>
<p>请把鼠标移动到单词上，可以看到鼠标指针发生变化：</p>
<span style="cursor:auto">auto</span><br>
<span style="cursor:crosshair">crosshair十字架</span><br> 
<span style="cursor:default">default</span><br>
<span style="cursor:e-resize">e-resize水平宽度</span><br>   
<span style="cursor:help">问号</span><br>       
<span style="cursor:move">move移动</span><br>       
<span style="cursor:n-resize">n-resize水平</span><br>   
<span style="cursor:ne-resize">ne-resize</span><br>  
<span style="cursor:nw-resize">nw-resize</span><br>
<span style="cursor:pointer">pointer 手</span><br>        
<span style="cursor:progress">progress加载中</span><br>       
<span style="cursor:s-resize">s-resize</span><br>
<span style="cursor:se-resize">se-resize</span><br>
<span style="cursor:sw-resize">sw-resize</span><br>
<span style="cursor:text">text</span><br>
<span style="cursor:w-resize">w-resize</span><br>
<span style="cursor:wait">wait等待</span><br>       
<span style="cursor:not-allowed">allowed禁止</span><br> 
</body>
</html>