首页 > Web开发 > 详细

html 鼠标指针讲解

时间:2019-11-04 13:25:32      阅读:68      评论:0      收藏:0      [点我收藏+]

html 鼠标指针

详情可以看https://www.w3school.com.cn/tiy/t.asp?f=csse_cursor

测试代码:

<html>

<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:pointer">
Pointer</span><br />
<span style="cursor:move">
Move</span><br />
<span style="cursor:e-resize">
e-resize</span><br />
<span style="cursor:ne-resize">
ne-resize</span><br />
<span style="cursor:nw-resize">
nw-resize</span><br />
<span style="cursor:n-resize">
n-resize</span><br />
<span style="cursor:se-resize">
se-resize</span><br />
<span style="cursor:sw-resize">
sw-resize</span><br />
<span style="cursor:s-resize">
s-resize</span><br />
<span style="cursor:w-resize">
w-resize</span><br />
<span style="cursor:text">
text</span><br />
<span style="cursor:wait">
wait</span><br />
<span style="cursor:help">
help</span>
</body>

</html>

大家可以看一看效果:

每一个鼠标指针都是不一样的,大家可以自己试一试。

至此,我们可以制作一个坑人小程序。

<html>

<body>
<p>请把鼠标放在下面两个文字上面查看你的电脑性能。转圈圈表示很卡,指针表示很好,问号表示未知</p>
<span style="cursor:wait">
性能检测1</span><br />
<span style="cursor:help">
性能检测2</span>
</body>

</html>

这个程序是一个假的性能检测。可以自己看看效果。

有任何事情,可以点击QQ联系找我。

写于2019-11-04 12:26:29 

 

 

html 鼠标指针讲解

原文:https://www.cnblogs.com/quqi/p/11791464.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!