HTML中鼠标放上后字的颜色怎么变白
<html><head><metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/><title>...
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>表格隔行换色</title>
<style type="text/css" media="screen">
table {border-collapse:collapse;border:solid #999;border-width:1px 0 0 1px;}
table td {border:solid #000000;border-width:0 1px 1px 0;}
tr.t1 td {background-color:#fff;}/* 第一行的背景色 */
tr.t2 td {background-color:#99FFFF;}/* 第二行的背景色 */
tr.t3 td {background-color:#0000FF;}/* 鼠标经过时的背景色 */
-->
</style>
</head>
<body>
<table id="tab" border="1">
<th width="180" height="25">大学</th>
<th width="130">类型</th>
<th width="150">优势学科</th>
<th width="80">地点</th>
<tr>
<td height="25">大连理工大学</td>
<td>研究型</td>
<td>力学、化工等</td>
<td>大连</td>
</tr>
</table>
<script type="text/javascript">
<!--
var Ptr=document.getElementById("tab").getElementsByTagName("tr");
function $() {
for (i=1;i<Ptr.length+1;i++) {
Ptr[i-1].className = (i%2>0)?"t1":"t2";
}
}
window.onload=$;
for(var i=0;i<Ptr.length;i++) {
Ptr[i].onmouseover=function(){
this.tmpClass=this.className;
this.className = "t3";
};
Ptr[i].onmouseout=function(){
this.className=this.tmpClass;
};
}
</script>
</body>
</html>
谁能帮我改一下，鼠标放上后能让字的颜色变成白的~ 展开
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>表格隔行换色</title>
<style type="text/css" media="screen">
table {border-collapse:collapse;border:solid #999;border-width:1px 0 0 1px;}
table td {border:solid #000000;border-width:0 1px 1px 0;}
tr.t1 td {background-color:#fff;}/* 第一行的背景色 */
tr.t2 td {background-color:#99FFFF;}/* 第二行的背景色 */
tr.t3 td {background-color:#0000FF;}/* 鼠标经过时的背景色 */
-->
</style>
</head>
<body>
<table id="tab" border="1">
<th width="180" height="25">大学</th>
<th width="130">类型</th>
<th width="150">优势学科</th>
<th width="80">地点</th>
<tr>
<td height="25">大连理工大学</td>
<td>研究型</td>
<td>力学、化工等</td>
<td>大连</td>
</tr>
</table>
<script type="text/javascript">
<!--
var Ptr=document.getElementById("tab").getElementsByTagName("tr");
function $() {
for (i=1;i<Ptr.length+1;i++) {
Ptr[i-1].className = (i%2>0)?"t1":"t2";
}
}
window.onload=$;
for(var i=0;i<Ptr.length;i++) {
Ptr[i].onmouseover=function(){
this.tmpClass=this.className;
this.className = "t3";
};
Ptr[i].onmouseout=function(){
this.className=this.tmpClass;
};
}
</script>
</body>
</html>
谁能帮我改一下，鼠标放上后能让字的颜色变成白的~ 展开
6个回答
展开全部
可以用 js 控制也可以使用css实现
1：使用 js的写法：
<span onmouseover="this.style.color='#ffffff'" onmouseout="this.style.color='#000000'" style="color:#000000;">文字</span>
设置初始的颜色为黑色。添加鼠标over事件，当鼠标移动到文字上面时变为白色，当鼠标移走时恢复为原来的颜色。
2：使用css 控制的写法为：
<a href="#">asdfasdfsdf</a>
a{color:#000000;}
a:hover{color:#ffffff}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
给他设置个a链接，在a:hover属性中设置：a:hover{color:#fff;}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<style>
a:hover{color:#fff;}
</style>
<body>
<a href="#">字体</a>
</body>
</html>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
直接可以用hover，如
td:hover{color:#fff;}
表示鼠标经过 td元素时，字体颜色变成#fff
td:hover{color:#fff;}
表示鼠标经过 td元素时，字体颜色变成#fff
追问
这个把鼠标移开后，字就永远是白色的了？我想让他还能恢复黑色。。。而且不是经过字才变白，是放到那一行，字直接全变白，移开后恢复黑
追答
是啊，是经过td元素，td元素里的字会变白，移开后，它会恢复原来的颜色
试一下这段代码，原来字是黑色，鼠标经过是红色
p:hover {color:#F00;}
test~~~
test~~~
test~~~
test~~~
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
在样式里加入td:hover，如：
<style type="text/css" media="screen">
table {border-collapse:collapse;border:solid #999;border-width:1px 0 0 1px;}
table td {border:solid #000000;border-width:0 1px 1px 0;}
tr.t1 td {background-color:#fff;}/* 第一行的背景色 */
tr.t2 td {background-color:#99FFFF;}/* 第二行的背景色 */
td:hover{color:#fff;}/* 鼠标经过时的背景色 */
-->
</style>
........
如果是放到那一行，字直接全变白，移开后恢复黑。就用tr:hover{color:#fff;}
<style type="text/css" media="screen">
table {border-collapse:collapse;border:solid #999;border-width:1px 0 0 1px;}
table td {border:solid #000000;border-width:0 1px 1px 0;}
tr.t1 td {background-color:#fff;}/* 第一行的背景色 */
tr.t2 td {background-color:#99FFFF;}/* 第二行的背景色 */
td:hover{color:#fff;}/* 鼠标经过时的背景色 */
-->
</style>
........
如果是放到那一行，字直接全变白，移开后恢复黑。就用tr:hover{color:#fff;}
追问
可不可以给我把这个程序改好发过来啊= =，实在没弄明白。。。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
如果你以上代码能实现鼠标滑过背景变色，那么只需向tr.t3 td添加一个color:#fff;
tr.t3 td {background-color:#0000FF;color:#fff;}/* 鼠标经过时的背景色 */
tr.t3 td {background-color:#0000FF;color:#fff;}/* 鼠标经过时的背景色 */
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（4）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
