如何避免css设置a标签的样式无效

 剑鱼论坛 发表于 2020年02月05日 CSS/CSS3  35
剑鱼论坛
LV 5 [初中]
最后在线:28分钟前
加入时间:262天前
主帖:84  跟帖:44

我们在制作页面的时候,现在普遍是使用css来控制页面的样式,对于页面上的链接,a标签也不例外,我们可以通过css来设置其样式,例如我们需要把链接设置为红色,那么可以用以下的代码实现:

a:link {color:#FF0000;}

我们知道对于链接还有其他不同的状态,例如已经被访问过的链接,鼠标滑过链接等等,这些状态的显示都可以用css来控制,我们先看下面的代码:

a:link {color:#FF0000;} /* 未访问的链接 */
a:visited {color:#00FF00;} /* 已访问的链接 */
a:hover {color:#FF00FF;} /* 鼠标划过链接 */
a:active {color:#0000FF;} /* 已选中的链接 */

以上代码是对于链接的完整css样式代码,每行代码所起的作用已经在后面的注释中说明了,这里不再重复。需要说明一下的是,代码的顺序。

首先,在CSS定义中,a:hover 必须被置于 a:link 和 a:visited 之后,才是有效的

其次,a:active 必须被置于 a:hover 之后,才是有效的

以上两点是写css样式的时候要注意的。

论坛主帖
146
论坛跟帖
110
在线访客
5
今日主帖
1
今日跟帖
0
今日注册
0
98
http://jianyuluntan.com/gentie.html
http://jianyuluntan.com/postzan.html
http://jianyuluntan.com/postcai.html
http://jianyuluntan.com/postshoucang.html
http://jianyuluntan.com/gentiezan.html
http://jianyuluntan.com/gentiecai.html
http://jianyuluntan.com/huifu.html
http://jianyuluntan.com/xiugai.html
http://jianyuluntan.com/shanchugentie.html
1
XzA=
1
© 2019 - 2020 剑鱼论坛 版权所有
Powered by JianYuLunTan
剑鱼论坛 976666861
http://jianyuluntan.com/feedback.html
http://jianyuluntan.com/qiandao.html
http://jianyuluntan.com/denglu.html
0
http://jianyuluntan.com/adenglu.html