主要作用是给用HTML做的链接修改样式
主要包括:
1.超链接访问前(被点前)状态a:link
2.超链接访问后(被点后)状态a:visited
3.鼠标指向超链接时(放在上面)状态a:hover
4.点击超链接时的状态a:active
注意的是:顺序不能改变 简单记为L V H A
基本格式为:
<style type="text/css">a:link{color:blue;text-decoration:none;}a:visitd{]a:hover{}a:active{}</style>
例子
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>360标签</title><link href="360小标签css表.css" rel="stylesheet" type="text/css" /></head><body><table align="center" width="100%" border="0" cellspacing="0" cellpadding="8"><tr align="center"><font size="+4" face="楷体"><td><a href="">汽车之家</a></td><td><a href="">易 车 网</a></td><td><a href="">太平洋汽车</a></td><td><a href="">安 居 客</a></td><td><a href="">折800</a></td><td><a href=""><font color="#00CC33">苏宁易购</a></font></td></tr><tr align="center"><font size="+4" face="楷体"><td><a href="">12306官网</a></td><td><a href="">人民</a><span>•</span><a href="">新华</a></td><td><a href="">赶 集 网</a></td><td><a href="">当 当 网</a></td><td><img src="360小图标/途牛.jpg" width="15" /><a href="">途牛旅游网</a></td><td><a href=""><font color="#00CC33"><i><b>1号店</b></i></a> <a href=""><img src="360小图标/抢福袋.jpg" width="40"/></a></td></font></tr><tr align="center"><font size="+4" face="楷体"><td><a href="">真爱婚恋网</a></td><td><a href="">梦 芭 莎</a></td><td><a href="">亚 马 逊</a></td><td><a href="">艺 龙 网</a></td><td><a href="">去哪儿网</a></td><td><a href="">美 丽 说</a></td></font></tr><tr align="center"><font size="+4" face="楷体"><td><a href="">美 团 网</a></td><td><a href="">乐视视频</a></td><td><img src="360小图标/唯品会.jpg" width="15"/><a href="">唯 品 会</a></td><td><a href=""><font color="#CC6600">聚美优品</a></td></font><td><a href="">搜 房 网</a></td><td><a href="">蘑 菇 街</a></td></font></tr><tr align="center"><font size="+4" face="楷体"><td><a href="">猎 聘 网</a></td><td><a href="">1 药 网</a></td><td><a href="">陆金所理财</a></td><td><a href="">六 间 房</a></td><td><a href="">携程机票</a></td><td><a href="">12306·抢票</a></td></font></tr></table></body></html>
View Code
这是未修改样式的超链接(从来没点过的默认蓝色,点过之后默认紫色)
下面用样式表修改
@charset "utf-8";
/* CSS Document */
<style type="text/css">
*
{
margin:0px;
margin:0px;
}
a:link
{
color:#000;
text-decoration:none;}/*下划线*/
a:visited
{
color:#000;
text-decoration:none}
a:hover
{
color:#F00;
text-decoration:underline;}
a:active
{
color:#F60;
text-decoration:underline;}
</style>
效果为: