您的位置：首页 > 职场人生

讲给Android程序员看的前端教程(16)——伪类

2017-12-01 09:31 681 查看

版权声明

本文原创作者：谷哥的小弟

作者博客地址：http://blog.csdn.net/lfdfhl

本文视频教程：http://www.stay4it.com/my/course/37

伪类

在CSS中，伪类用于向某些选择器添加特殊的效果。

在此介绍与超链接标签a有关的伪类。请看如下示例：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>伪类</title>
<style type="text/css">

a:link{
color: red;
text-decoration: none;
}

a:visited{
color: pink;
}

a:hover{
color: green;
text-decoration: underline;
}

a:active{
color: black;
}

</style>
</head>
<body>
<a href="http://blog.csdn.net/lfdfhl" target="_blank">谷哥的小弟</a>
</body>
</html>

代码详解如下：

利用a:link{ }设置了超链接的颜色，它的作用等同于a{ }选择器；但是某些浏览器不支持a:link{ }的写法导致其设置失效

利用a:visited{ }设置超链接访问过后的样式

利用a:hover{ }设置鼠标放到超链接上时的样式

利用a:active{ }设置超链接被点击瞬间的样式

请按照先后顺序实现a:visited{ }和a:hover{ }以及a:active{ }从而确保浏览器显示预计的效果

请分别在IE浏览器和谷歌浏览器中运行本示例，注意伪类在不同浏览器中可能出现的细微差异。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航