打开超链接如何设置css属性?

html-css025

打开超链接如何设置css属性?,第1张

通过 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>

例如有一个超链<a

href="#"

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

<!--

只要有的功能想要的都可以加上

-->

}