CSS表格设计
发布网友
发布时间：2022-04-22 06:43
共4个回答
热心网友
时间：2022-04-19 09:29
抱歉.这个CSS做不到......CSS只能做到让表格隔行颜色不同....如果说经过表格时颜色改变的话..可那在其他高版本的浏览器中能够实现或许..注意..只是说或许.因为我也没有利用高版本的浏览器...
做到兼容性上...还是利用JS来实现好点...
顺便说下.css实现隔行颜色不同的话...也是要页面输出table后..然后给tr加上不同class来实现的...然后指定class的css就可以了....
如果你是静态页面的话...用JS实现tr动态添加CLASS也行..但是如果你是PHP或者服务端语言输出的话...可以直接判断下....
比如..用三元运算符..?: ..这样是可以的.先判断前一个输出的是什么颜色..如果是..换色..如果不是则就指定这个颜色..
例外....推荐你一个JS库.jquery..它做的一个经典的一个例子就是实现表格的斑马线...具体怎么实现就不说了...网上方法.很多...自己找找吧..象这种的...动态输入就用三元运算符判断......或者JS来指定..但是那样很麻烦....
热心网友
时间：2022-04-19 10:47
<!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>
<style type="text/css">
<!--
table { background-color:#000000; cursor:hand; width:100%; background-color:#eaf5ff; }
tr {background-color:#4bacff; color:#0000FF;}
td{
event: expression(
onmouseover=function(){
this.style.borderColor ='blue';this.style.color='red';
this.style.backgroundColor ='yellow';
},
onmouseout=function(){this.style.borderColor='';
this.style.color='';this.style.backgroundColor ='';});
background-color;#00CCCC;
}
td:hover{background-color:#0000FF;}
.bs1{background:#FF6600;}
.bs2{background:#CCCCCC;}
.bs3{background:#FFCC33;}
-->
</style>
</head>
<body>
<table>
<tr class="bs1"><td>第1行</td><td>第1列</td></tr>
<tr class="bs2"><td>第2行</td><td>第2列</td></tr>
<tr class="bs3"><td>第3行</td><td>第3列</td></tr>
<tr class="bs2"><td>第4行</td><td>第4列</td></tr>
<tr class="bs3"><td>第5行</td><td>第5列</td></tr>
</table>
</body>
</html>
热心网友
时间：2022-04-19 12:22
asp 页面需要一个for循环，asp.net 如果是用datagrid、repeater 控件有相应的设置，
鼠标经过行颜色改变，是在tr标签中加入事件，onmouseover="this.backgroundColor:red" onmouseout="this.backgroundColor:''";建议你在tr里嵌套一个span标签，span标签内包含tr里的所有td标签，把onmouseover 和onmouseout事件应用在span上，这样就不用去判断当前tr的背景色了
热心网友
时间：2022-04-19 14:13
look this
------
http://hi.baidu.com/chssheng2007/blog/item/a43a377eadc229330cd7da13.html
