CSS3的超链--简单粗暴（一天学一点）

什么是超链

在用HTML5编写一些网页时，我们通常会用到给一些文本或者是图片添加链接来实现跳转，使得整个小小页面却也内容丰富多彩。
例如：

<a href=“url” target=“_blank”>文本或<img src=“图片路径”/></a>

url:链接路径，比如百度，那么这里的url=www.baidu.com
target这个属性意思是打开方式，_self也是默认的在当前窗口打开，_blank在新窗口打开，framename是在指定名称的框架中打开。

使用伪类来设置样式

这里有个伪类的概念需要认识，伪类就是被选中的元素处于某种状态的时候。
超链的四种状态：

link	初始状态，从未被访问过
visited	已经访问过
hover	鼠标悬停于超链的上方
active	鼠标左键点击下去，但是未释放的时候

实例：

<style>
a:link {color: red}
a:visited {color:green}
a:hover {color: yellow}
a:active {color: black}
</style>
<a href="http://www.baidu.com">百度</a>

初始状态
鼠标悬停时的状态
鼠标左键点击时状态
已经访问过状态

超链–下划线

超链在默认状态下，有下划线的，为了美观去掉下划线可以使用 text-decoration: none 文本修饰的样式来解决

<style>
a.no_underline {text-decoration: none}
</style>
  
<a href="http://www.baidu.com">百度</a>
<br>
<a class="no_underline" href="http://www.baidu.com">百度</a>

运行效果：