HTML TABLE

来源：互联网发布：淘宝网店铺搜索编辑：程序博客网时间：2024/05/16 06:08
SHOW:
CODE:
<html> <title>表格</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <style type="text/css">.bg td{font-size:12px;text-align:left;line-height:15px;height:20px;}.bg td.tit{    background-color:#00a0ff;    height:17px;text-align:center;line-height:15px;}.bg td.num{    background-color:#00a0ff;text-align:center;line-height:15px;width:30px;height:22px;}.resizeDivClass{   text-align:right;   width:1px;   margin:0px 0 0px 0;   background:#fff;   border:0px;   float:right;   cursor:e-resize;} </style><script language="javascript">//("表格ID","奇数行背景","偶数行背景","鼠标经过背景","点击后背景");function theObjTable(obj,oddbgc,evenbgc,moc,clickc){var t=document.getElementById(obj).getElementsByTagName("tr");for(var i=0;i<t.length;i++){t[i].style.backgroundColor=(t[i].sectionRowIndex%2==0)?oddbgc:evenbgc;t[i].onclick=function(){if(this.x!="1"){this.style.backgroundColor=clickc;this.x="1";}else{this.x="0";this.style.backgroundColor=(this.sectionRowIndex%2==0)?oddbgc:evenbgc;}}t[i].onmouseover=function(){if(this.x!="1")this.style.backgroundColor=moc;}t[i].onmouseout=function(){if(this.x!="1")this.style.backgroundColor=(this.sectionRowIndex%2==0)?oddbgc:evenbgc;}}}</script><body ><table width="500px"  class="bg"   border=1 cellspacing=0   bordercolorlight="#7b7b7b"  bordercolordark="#efefef" id="theObjTable" >        <tr >             <td class="num" >序号</td>             <td width="100px" class="tit" >             公司名称              </td>             <td class="tit" >             订单客户             </td>             <td class="tit" >             部门              </td>             <td class="tit" >             业务员             </td>             <td class="tit" > 交款方式             </td>       </tr>       <tr  >            <td  class="num" >1</td>            <td >中国电信</td>            <td >订单客户名称</td>            <td >广告部</td>            <td >王天一</td>            <td >现金</td>       </tr >       <tr  >            <td class="num" >2</td>            <td >中国移动</td>            <td >订单客户名称</td>            <td >营销部</td>            <td >李小红</td>            <td >信用卡</td>       </tr >       <tr  >            <td class="num" >3</td>            <td >中国联通</td>            <td >订单客户名称</td>            <td >市场部</td>            <td >王老二</td>            <td >银行卡</td>       </tr >   <tr  >            <td  class="num" >4</td>            <td >中国电信</td>            <td >订单客户名称</td>            <td >广告部</td>            <td >王天一</td>            <td >现金</td>       </tr >       <tr  >            <td class="num" >5</td>            <td >中国移动</td>            <td >订单客户名称</td>            <td >营销部</td>            <td >李小红</td>            <td >信用卡</td>       </tr >       <tr  >            <td class="num" >6</td>            <td >中国联通</td>            <td >订单客户名称</td>            <td >市场部</td>            <td >王老二</td>            <td >银行卡</td>       </tr > </table> <script>//("表格名称","奇数行背景","偶数行背景","鼠标经过背景","点击后背景");theObjTable("theObjTable","#f0f0f0","#fff","#00faa2","#00faf2");</script></body> </html>