案例:CSS案例     状态:可编辑再运行    进入竖版
 运行结果 
x
 
1
<html>
2
<head>
3
<style type="text/css">
4
a.one:link {color: #ff0000}
5
a.one:visited {color: #0000ff}
6
a.one:hover {color: #ffcc00}
7
8
a.two:link {color: #ff0000}
9
a.two:visited {color: #0000ff}
10
a.two:hover {font-size: 150%}
11
12
a.three:link {color: #ff0000}
13
a.three:visited {color: #0000ff}
14
a.three:hover {background: #66ff66}
15
16
a.four:link {color: #ff0000}
17
a.four:visited {color: #0000ff}
18
a.four:hover {font-family: monospace}
19
20
a.five:link {color: #ff0000; text-decoration: none}
21
a.five:visited {color: #0000ff; text-decoration: none}
22
a.five:hover {text-decoration: underline}
23
</style>
24
</head>
25
26
<body>
27
<p>请把鼠标移动到这些链接上,以查看效果:</p>
28
29
<p><b><a class="one" href="/index.html" target="_blank">这个链接改变颜色</a></b></p>
30
<p><b><a class="two" href="/index.html" target="_blank">这个链接改变字体大小</a></b></p>
31
<p><b><a class="three" href="/index.html" target="_blank">这个链接改变背景颜色</a></b></p>
32
<p><b><a class="four" href="/index.html" target="_blank">这个链接改变字体系列</a></b></p>
33
<p><b><a class="five" href="/index.html" target="_blank">这个链接改变文本装饰</a></b></p>
34
</body>
35
36
</html>
37