<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>针对链接的CSS样式</title>
<style>
:link{ /*a:link网站未被访问时的样式,这里的a标签可以不写,因为link只针对a标签,下面两个一样*/
color:red;/*未访问时a标签里的字体是红色*/
}
:visited{ /*a:visited网站已被访问过的样式*/
color:yellow;/*访问后a标签里的字体变黄色*/
}
:active{ /*a:active按住鼠标不撒手时的状态,激活网站*/
color:green;/*点击时a标签里的字体变成绿色*/
}
a:hover{ /*a:hover鼠标经过字体时出现的样式*/
background:red;/*鼠标经过字体时,有红色背景,即鼠标悬停时样式*/
}
div:hover{ /*hover不仅针对a标签,其他标签也适用*/
background-color:blue;/*background后面加不加color都是表示背景颜色*/
cursor:progress;
/*cursor:鼠标样式,auto(正常鼠标样式)、default(默认鼠标)和move(移动鼠标)都显示的是默认时的鼠标样式,crosshair是十字鼠标,pointer是点状鼠标,text是文字鼠标,wait是等待鼠标,help是求助鼠标,progress是过程鼠标*/
}
div{
200px;
height:300px;
border:1px solid #000000;
}
/*块级元素可以加宽高,行内元素不可以加宽高*/
</style>
</head>
<body>
<a href="#">百度</a>
<a href="#">网易</a>
<a href="#">谷歌</a>
<div></div>
</body>
</html>