【HTML】鼠标特效

最新推荐文章于 2024-07-21 17:36:42 发布

idealistic

最新推荐文章于 2024-07-21 17:36:42 发布

阅读量2.5k

点赞数 1

分类专栏： HTML小程序

本文链接：https://blog.csdn.net/idealistic/article/details/70194049

版权

HTML小程序专栏收录该内容

24 篇文章 3 订阅

订阅专栏

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>鼠标特效</title>
</head>

<body>
<h2>CSS鼠标控制箭头</h2>
<div style="font-size:10pt;color:DarkBlue">
<p style="cursor:hand">手形</p>
<p style="cursor:move">移动</p>
<p style="cursor:help">帮助</p>
<p style="cursor:n-resize">箭头朝上双向</p>
<p style="cursor:pointer">指示</p>
<p style="cursor:wait">等待</p>
</div>
</body>
</html>

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>鼠标手势</title>
</head>
<style>
a{
	display:block;
	background-image:url(t01e781575902ba7f2a.jpg);
	background-repeat:no-repeat;
	width:100px;
	text-align:center;
	height:30px;
	line-height:30px;
	color:#111111;
	text-decoration:none;
	}
a:hover{
	background-image:url(%E9%98%BF%E8%90%A8.PNG);
	color:#FF0000;
	text-decoration:none;
	}
.help{
	cursor:help;}
.text{cursor:text;}
</style>
<body>
<a href="#" class="help">帮助我们</a>
<a href="#" class="text">招聘信息</a>
</body>
</html>