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

2024-08-24 03:15:42

第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精灵

最新文章

热门文章