今天我们接着分享关于超链接样式的内容。
上节我们知道了“a：hover”可以定义鼠标悬停超链接a时的样式。很多初学者都认为hover只限于a标签使用，如果你这样理解，就埋没了css一个功能强大的技巧了。“：hover”伪类是可以定义任何一个元素的鼠标悬停时的样式的。
语法：
元素：hover {属性：属性值；}
元素可以是任意的块元素和行内元素。
示例代码：
<html><head><title>hover伪类</title><style type="text/css">div{width:200px;height:80px;border:1px solid black;}div:hover { background-color:green;}span{}span:hover { background-color:green;}p{border:1px solid black;}p:hover { background-color:green;}</style></head><body><div>块元素</div><span>行内元素</span><p>段落</p></body></html>
鼠标样式：
在css中，有两种定义方式，一是浏览器鼠标样式，二是自定义鼠标样式。
语法：
cursor:属性值；
| 鼠标样式cursor的属性值 | |
| 属性值 | 说明 |
| default | 默认值，白色箭头 |
| pointer | 手 |
| text | 文本光标 |
| crosshair | 十字架 |
| wait | 等待 |
| help | 箭头带问号 |
| move | 带方向的十字架箭头 |
| e-resize | 左右扩展箭头 |
| ne-resize | 右上左下扩展箭头 |
| nw-resize | 左上右下扩展箭头 |
| n-resize | 上下扩展箭头 |
| se-resize | 左上右下扩展箭头 |
| sw-resize | 左下右上扩展箭头 |
| s-resize | 上下扩展箭头 |
| w-resize | 左右扩展箭头 |
虽然我们看到cursor属性取值很多，但是在实际开发中，通常用到的也就是default和pointer两个属性值。
示例代码：
<html><head><title>鼠标样式</title><style type="text/css">div{width:200px;height:50px;margin-bottom:20px;border:1px solid black;text-align:center;background-color:green;}#d1 { cursor:default;}#d2 { cursor:pointer;}#d3 { cursor:text;}#d4 { cursor:crosshair;}#d5 { cursor:wait;}#d6 { cursor:help;}#d7 { cursor:move;}</style></head><body><div id="d1">default</div><div id="d2">pointer</div><div id="d3">text</div><div id="d4">crosshair</div><div id="d5">wait</div><div id="d6">help</div><div id="d7">move</div></body></html>
自定义鼠标样式：
语法：
cursor:url("路径地址"),属性；
示例代码：
<html><head><title>自定义鼠标样式</title><style>div{width:200px;height:80px;border:1px solid black;}#d1 { cursor:url("images/deault.cur"),default}#d2 { cursor:url("images/pointer.cur"),pointer}</style></head><body><div id="d1">default</div><div id="d2">pointer</div></body></html>
这个代码中的鼠标样式文件，需要大家自己去百度下载一下，放到相应的路径中，就可以看到效果了。使用自定义鼠标样式，可以打造出更加具有个性化的网站，美观大方。
本章总结：
去除超链接下划线，可以使用“text-decoration:none”；
超链接伪类：
a:link，未访问时的样式；
a:visited，访问后的样式；
a:hover，鼠标悬停的样式；
a:actived，鼠标单击激活的样式；
四个伪类的书序，必须是link、visited、hover、active，不然浏览器无法正常显示。参考记忆顺序，可以使用两个英文单词“love hate”。一般情况下，只需要两个状态即可，就是link和hover。
hover伪类：
我们可以使用：hover伪类来定义任何一个元素在鼠标悬停时的样式。
div:hover，p:hover，等等；
鼠标样式：
有两种方式，一种是浏览器鼠标样式，一种是自定义鼠标样式；
3221
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
