如何使鼠标移到链接上时字体的背景颜色改变

Question

我想让鼠标到字上的时候整个框里都是跟边框一个颜色，应该怎么改变？

Answer 1

亲，下回提代码问题，请直接上代码，别截图，还得手打代码！

像这种直接定义A标签为块级标记，然后写A标签的边框，背景颜色就可以了，CSS代码修改为如下：

<style>
.bar1 {
/*注释掉以前bar1的代码
margin:10px 0px 0px 0px;
padding:10px 0px 0px 0px;
border:3px solid #ffe7ba;
width:90px;
border-top-left-radius:20px 20px;
border-top-right-radius:20px 20px;
border-bottom-left-radius:20px 20px;
border-bottom-right-radius:20px 20px;
*/
text-align:center;/*设置文本对齐为居中*/
vertical-align:middle;/*设置bar1中的内容为垂直居中*/
}
/*bar1 中的a标签的属性*/
.bar1 a {
text-decoration:none;
display:block;/*第一步要将a标签定义为块级标记，这个很重要，如果不定义为块，就不好使，你可以试试*/
/*以下代码是以前bar1的样式*/
margin:10px 0px 0px 0px;
padding:10px 0px 0px 0px;
border:3px solid #ffe7ba;
width:90px;
border-top-left-radius:20px 20px;
border-top-right-radius:20px 20px;
border-bottom-left-radius:20px 20px;
border-bottom-right-radius:20px 20px;
}
/*设置bar1中a标签鼠标效果*/
.bar1 a:hover {
color:#000;
background-color:#ffe7ba;
}
</style>

Answer 2

网页上的超链接默认访问之前是蓝色，访问后是红色。一般不同的浏览器有不同的默认颜色。可以通过控制BODY标记的超链接颜色属性来控制这些颜色的变化
〈Body Link="*" Vlink="*" Alink="*"〉

“Link”、“Vlink”、“Alink”都是Body标识符的属性。其中"*"是指定颜色，它的值有：BLACK、BLUE、GREEN 等。“Link”决定还未访问的超链接的颜色，“Alink”决定访问时超链接的颜色，而“Vlink”决定已访问过的超链接的颜色。你可以试一下把上面的语句写成：
〈Body Link="RED" Alink="BLACK" Vlink="BLUE"〉

这样你网页上的超链接将在访问之前是红色，访问时是黑色，追问

我什么都没点它显示的就是默认已连接的样式是什么原因呢？重新加载也显示被连接过得样式。我们老师教的是在a上直接加伪类：hover，visited，link一类的，伪类hover，visited,link不能重复使用么？我的意思是加入这个链接已经被链接过了那么hover定义多样式不能显示么？
求回答，麻烦啦~

追答

可能是前面您调试时已经点过，缓存里有记录，所以您再打开时还是显示已点击过．

另外也可以用下面的方式达到同样的效果：

用CSS,a:link是无操作的链接的风格，a:visited是访问过的链接,a:hover是鼠标移上去时的,a:active是获得焦点时的：

a:link{color:#0066CC}
a:visited {color:#00CC66}
a:hover {color:#FF0099}
a:active {color:#FF9900}

本回答被提问者和网友采纳

Answer 3

都做成图片岂不是更好？