14_css伪类控制链接.html


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>CSS伪类控制链接</title>


<style type="text/css">

a:link{color:black; text-decoration:underline;}

a:visited{color:red; text-decoration:line-through;}

a:hover{color:blue; text-decoration:overline;}

a:active{color:green; text-decoration:blink}

a.web:visited{ color:gold;}/*伪类与 CSS 类配合使用*/

input{

height:30px;

width:300px;

border:2px solid gold;

vertical-align:middle;/*设置输入框外面的文本在输入框外部的中间位置*/

line-height:30px;/*行高设置成和height值一样时,文字就在垂直方向上就中间显示*/

}

input:focus{background:#CCFFFF;}/*输入框里面变成了焦点ie6/7不支持*/

</style>


</head>


<body>

<a href="http://www.baidu.com" class="web">网页设计</a>

<a href="http://www.baidu.com">平面设计</a>

<a href="http://www.baidu.com">动漫设计</a>

<a href="http://www.baidu.com">java设计</a>

<a href="http://www.baidu.com">php设计</a>

<a href="http://www.baidu.com">ios设计</a>

<label>用户名:<input type="text" name="username" /></label>

<label>密码:<input type="password" name="psw" /></label>

</body>

</html>


你可能感兴趣的:(14_css伪类控制链接.html)