笔记《精通css》第5章 链接应用样式

第5章    链接应用样式

1.链接伪类选择器

a : link{    }   (寻找没有被访问过的链接)

a : visied{    }(寻找被访问过的链接)

 

动态伪类选择器

a : hover{    }(寻找鼠标悬停处的链接)

a : focus{    }(寻找通过键盘移动到的链接)

a : active{    }(寻找被激活的链接)

 

选择器的次序，次序混乱样式将不起作用

a : hover{    }

a : focus{    }

a : active{    }

a : link{    }   

a : visied{    }

 

2.下划线，默认情况下链接有下划线

用属性

text-decoration : none(没有下划线)

text-decoration : underline(有下划线)

border-bottom : 1px dotted #000(黑点下划线)

border-bottom-style : solid(实线下划线)

font-weight : bold(链接加粗)

 

奇特链接下划线

textt-decoration : none;

background:url() repeat-x  left bottom;(斜线下划线)

background-image:url(  )(动画)

 

为链接目标设置样式

<a href="http;//XXXXXXXX#comment3">XXXXX</a>

.comment：target{background-color:yellow;}

 

3.给不同类型的链接加图标

外部链接样式

邮件链接样式

下载文档提示

 

4.按钮链接

修改a属性

display:block;

width:

line-height:

text-align:center;

下划线

边框

背景颜色

字颜色

 

5.css精灵