CSS下划线在网页布局中是非常常见的一种样式,尤其是在选中状态下。下面这段代码展示了如何在CSS中为选中状态添加下划线:a:link { /* 未访问的链接 */ text-decoration: n
CSS下划线在网页布局中是非常常见的一种样式,尤其是在选中状态下。下面这段代码展示了如何在CSS中为选中状态添加下划线:
a:link { /* 未访问的链接 */ text-decoration: none; /* 去除下划线 */ } a:visited { /* 已访问的链接 */ text-decoration: none; /* 去除下划线 */ } a:hover { /* 鼠标悬停在链接上 */ text-decoration: underline; /* 添加下划线 */ } a:active { /* 选中状态 */ text-decoration: underline; /* 添加下划线 */ }
如你所见,给选中状态下的链接添加下划线只需要在CSS中为a:active选择器添加text-decoration:underline属性即可。同样的,鼠标悬停在链接上时也会显示下划线,只不过这个时候是用a:hover选择器来实现的。而为了避免干扰,为未访问的链接和已访问的链接都加上了text-decoration:none属性,这样就可以保证其它状态下不会有下划线。
粉丝
0
关注
0
收藏
0