为了使我们的web页面设计的更加人性化，我们可以丰富鼠标形状的变化从而改变用户的体验！你可以从一下代码中找到合适自己所使用的鼠标形状！
代码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>css12.html</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<style type="text/css">
<!--
.hand{cursor:hand;} /*手形*/
.crosshair{cursor:crosshair;} /*精确定位“+”字*/
.move{cursor:move;} /*移动*/
.e-resize{cursor:e-resize;} /*箭头朝右方*/
.ne-resize{cursor:ne-resize;} /*箭头朝右上方*/
.nw-resize{cursor:nw-resize;} /*箭头朝左上方*/
.n-resize{cursor:n-resize;} /*箭头朝上方*/
.se-resize{cursor:se-resize;} /*箭头朝右下方*/
.s-resize{cursor:s-resize;} /*箭头朝下方*/
.w-resize{cursor:w-resize;} /*箭头朝左方*/
.text{cursor:text;} /*“I”字型*/
.wait{cursor:wait;} /*等待*/
.help{cursor:help;} /*帮助*/
-->
</style>
</head>
<body>
<p class="hand">
Give me a hand!（手形）
</p>
<p class="crosshair">
Give me a crosshair（精确定位）!
</p>
<p class="move">
Give me a Move（移动）!
</p>
<p class="e-resize">
Give me a e-resize(箭头方向朝右)!
</p>
<p class="ne-resize">
Give me a ne-resize(箭头方向朝右上)!
</p>
<p class="nw-resize">
Give me a nw-resize(箭头方向朝左上)!
</p>
<p class="n-resize">
Give me a n-resize(上)!
</p>
<p class="se-resize">
Give me a se-resize(左下)!
</p>
<p class="s-resize">
Give me a s-resize(下)!
</p>
<p class="w-resize">
Give me a w-resize(左)!
</p>
<p class="text">
Give me a text(文本)!
</p>
<p class="wait">
Give me a wait(等待)!
</p>
<p class="help">
Give me a help(帮助)!
</p>
</body>
</html>
扫一扫
1300
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
