博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
table-样式1
阅读量:5874 次
发布时间:2019-06-19

本文共 1642 字,大约阅读时间需要 5 分钟。

hot3.png

<!DOCTYPE html>

<html>
<head>
 <meta charset="UTF-8">
 <title>table-</title>
</head>
<body>
 <!-- Javascript goes in the document HEAD -->
<script type="text/javascript">
function altRows(id){
 if(document.getElementsByTagName){ 
  
  var table = document.getElementById(id); 
  var rows = table.getElementsByTagName("tr");
  
  for(i = 0; i < rows.length; i++){         
   if(i % 2 == 0){
    rows[i].className = "evenrowcolor";
   }else{
    rows[i].className = "oddrowcolor";
   }     
  }
 }
}

window.οnlοad=function(){

 altRows('alternatecolor');
}
</script>

<!-- CSS goes in the document HEAD or added to your external stylesheet -->
<style type="text/css">
table.altrowstable {
 font-family: verdana,arial,sans-serif;
 font-size:11px;
 color:#333333;
 border-width: 1px;
 border-color: #a9c6c9;
 border-collapse: collapse;
}
table.altrowstable th {
 border-width: 1px;
 padding: 8px;
 border-style: solid;
 border-color: #a9c6c9;
}
table.altrowstable td {
 border-width: 1px;
 padding: 8px;
 border-style: solid;
 border-color: #a9c6c9;
}
.oddrowcolor{
 background-color:#d4e3e5;
}
.evenrowcolor{
 background-color:#c3dde0;
}
</style>

<!-- Table goes in the document BODY -->
<table id="alternatecolor">
<tr>
 <th>Info Header 1</th><th>Info Header 2</th><th>Info Header 3</th>
</tr>
<tr>
 <td>Text 1A</td><td>Text 1B</td><td>Text 1C</td>
</tr>
<tr>
 <td>Text 2A</td><td>Text 2B</td><td>Text 2C</td>
</tr>
</tr>
<tr>
 <td>Text 3A</td><td>Text 3B</td><td>Text 3C</td>
</tr>
<tr>
 <td>Text 4A</td><td>Text 4B</td><td>Text 4C</td>
</tr>
<tr>
 <td>Text 5A</td><td>Text 5B</td><td>Text 5C</td>
</tr>
</table>

<!--  The table code can be found here: -->

 

</body>

</html>

转载于:https://my.oschina.net/glelaine/blog/284947

你可能感兴趣的文章
美国人这样教育小学生_节选
查看>>
大公司里学做人,小公司里学做事。
查看>>
html5学习笔记——html保留标签(一)
查看>>
第九次作业
查看>>
你们以为运营商只是HTTP插点广告而已么?
查看>>
远程下载马bypass waf
查看>>
关系完整性约束
查看>>
BZOJ 1007 [HNOI2008]水平可见直线 ——半平面交 凸包
查看>>
Linux内核第六节 20135332武西垚
查看>>
hdu1243 dp (类最长公共子序列)
查看>>
图论--有向图强连通分量的标记及缩点模板
查看>>
hdu3294 Girls' research manacher
查看>>
通用sqlserver分页存储过程
查看>>
(转载)C#提取汉字拼音首字母的方法
查看>>
PXE-cobbler 无人值守装机------续
查看>>
关于-O0、O1、O2、O3优化
查看>>
ajax笔记
查看>>
布局模型
查看>>
Jquery弹窗
查看>>
生日小助手
查看>>