为了账号安全,请及时绑定邮箱和手机立即绑定

如何让鼠标点击过之后的链接字体颜色变化?

如何让鼠标点击过之后的链接字体颜色变化?

慕少森 2019-04-03 11:07:17
如何让鼠标点击过之后的链接字体颜色变化
查看完整描述

4 回答

?
翻过高山走不出你

TA贡献1875条经验 获得超3个赞

<style type="text/css">
   <!--
   a:link { text-decoration: none;color: blue}
   a:active { text-decoration:blink}
   a:hover { text-decoration:underline;color: red}
   a:visited { text-decoration: none;color: green}
   -->
   </style>

  其中:
  a:link 指正常的未被访问过的链接;
  a:active 指正在点的链接;
  a:hover 指鼠标在链接上;
  a:visited 指已经访问过的链接;
  text-decoration是文字修饰效果的意思;
  none参数表示超链接文字不显示下划线;
  underline参数表示超链接的文字有下划线



查看完整回答
反对 回复 2019-04-06
?
狐的传说

TA贡献1804条经验 获得超3个赞

HTML中可以用CCS样式来控制鼠标经过超链时变色。可以文字变色也可使层的背景变色。

具体例子:

1,使文字变色,新建一个ID为abc的DIV 在里 在DIV写入文字(任意文字)

同时建立一个空连接 代码如下:

1

<div id="abc"><a href="#">文字</a></div>

同时 定义文字的CSS样式(文字为黑色宋体) 代码如下:

1

2

3

4

5

6

7

8

<style type="text/css">

<!--

#abc {

    font-family: "宋体";

    color: #000000;

}

-->

</style>

再定义 鼠标经过时 文字的颜色 (文字为宋体 红色)代码变为:

1

2

3

4

5

6

7

8

9

10

11

12

<style type="text/css">

<!--

#abc {

    font-family: "宋体";

    color: #000000;

}

#abc a:hover {

    font-family: "宋体";

    color: #FF0000;

}

-->

</style>

2,使背景色变色,在示例1中的DIV 定义它为高度 宽度分别为50px; 背景为灰色

  同时a标签也定义高度 宽度分别为50px;的块

代码如下:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

<style type="text/css">

<!--

#abc {

    font-family: "宋体";

    color: #000000;

    background-color: #CCCCCC;

    height: 50px;

    width: 50px;

}

#abc a:hover {

    font-family: "宋体";

    color: #FF0000;

}

#abc a {

    background-color: #CCCCCC;

    display: block;

    height: 50px;

    width: 50px;

}

-->

</style>

再定义鼠标经过时变动的颜色(颜色为蓝色) 代码如下:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

<style type="text/css">

<!--

#abc {

    font-family: "宋体";

    color: #000000;

    background-color: #CCCCCC;

    height: 50px;

    width: 50px;

}

#abc a:hover {

    font-family: "宋体";

    color: #FF0000;

    background-color: #0066FF;

}

#abc a {

    background-color: #CCCCCC;

    display: block;

    height: 50px;

    width: 50px;

}

-->

</style>


查看完整回答
反对 回复 2019-04-06
?
慕田峪4524236

TA贡献1875条经验 获得超5个赞

<style>
a:hover{color:这里写你要的颜色}
</style>

查看完整回答
反对 回复 2019-04-06
  • 4 回答
  • 0 关注
  • 1808 浏览

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信