通过 CSS,可以在 HTML 中的超链接元素上设置样式。
首先,可以使用 a 标签选择器来选择所有超链接元素。例如:
a {
color: blue
text-decoration: none
}
color:设置超链接文本的颜色
text-decoration:设置或删除下划线
接着,可以使用 :link、:visited、:hover、:active 四个伪类来设置不同状态下的样式。
例如:
a:link {
color: blue
}
a:visited {
color: purple
}
a:hover {
color: red
}
a:active {
color: orange
}
:link 表示未访问过的链接
:visited 表示已经访问过的链接
:hover 表示鼠标悬停在链接上的状态
:active 表示正在点击链接的状态
<style>a.style1 {color:red} /*第一种样式*/
a.style2 {color:blue} /*第二种样式*/
</style>
<a class=style1 href="#">第一种超链接文字样式style1</a>
<a class=style2 href="#">第二种超链接文字样式style2</a>
例如有一个超链<ahref="#"
id="aa"
class="bb"></a>
在样式表中设置:
#aa{
<!--
或者设置为
.bb
-->
font-family:微软雅黑
<!--
字体
-->
font-size:14px
<!--
字体大小
-->
color:gray
<!--
字体颜色
-->
text-decoration:none
<!--
字体下划线等;underline下划线,overline
上划线,line-through线在中间
-->
cursor:pointer
<!--
鼠标在字上时显示小手
-->
}
如果想设置鼠标悬停在字上时的效果:
#aa:HOVER{
<!--
或者设置为
.bb
-->
font-family:xxx
<!--
字体
-->
font-size:xxx
<!--
字体大小
-->
color:
xxx
<!--
字体颜色
-->
text-decoration:xxx
<!--
只要有的功能想要的都可以加上
-->
}