html中如何使鼠标经过超链接时变色

要尽量简洁

1、首先我们先来编写一个HTML框架

2、我们来创建一个a标签,进行超链接的展示;

3、我们接下来书写head书签,在其中进行书写其他编写;

4、接着书写style标签,在其中书写css代码;

5、我们利用a:link 进行对未点击的超链接进行样式设置;

6、接着利用a:visited进行对已点击的超链接进行设置;

7、最后,我们还可以对鼠标悬停的状态进行样式修改,如图代码 a:hover;

温馨提示:答案为网友推荐,仅供参考
第1个回答  推荐于2017-10-11

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


具体例子:

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

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

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

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

<style type="text/css">
<!--
#abc {
font-family: "宋体";
color: #000000;
}
-->
</style>

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

<style type="text/css">
<!--
#abc {
font-family: "宋体";
color: #000000;
}
#abc a:hover {
font-family: "宋体";
color: #FF0000;
}
-->
</style>


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

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

代码如下:

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

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

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

第2个回答  2022-05-16

在页面中写一个指向www.baidu.com的超链接,要求访问前是黄色,鼠标移上去变蓝色,访问后变红色:

第3个回答  推荐于2017-09-01
<style>
a:hover{color:这里写你要的颜色}

</style>本回答被提问者采纳
相似回答