CSS布局技巧
转载请注明来源：https://www.cnblogs.com/hookjc/
设置ID背景颜色：document.getElementById('id').stytle.backgroundColor="";
可随意给ID添加未有的属性，用以保存数据：var myobj=document.getElementById('id'); myobj.myporperty='自定义属性';
给table标签中的tr标签设置奇偶行的颜色不同：tr{background-color: expression(this.rowIndex%2 == 0? "#FFFFFF" : "#E2F1FA");}
div中设置同一行中的内容不同的对齐方式：
#MainDiv{ background-color:#408BC2; margin-bottom:2px; text-align:right;height:30px;line-height:30px; }
#infocountdiv{ float:left; font-size:10pt; color:#ECE9D8; font-weight:bold;}
<div id=MainDiv>
<div id=infocountdiv>此内容靠左</div>此内容靠右
</div>
滚动条：标题固定不动--注意：去掉html标签中规定的模板以确保此布局有效
<style type="text/css">
.td_relative{
background-color:#CCCCCC;
top:expression(document.getElementById("dv").scrollTop-1);
position:relative;
z-index:1;
}
#mainform{overflow:hidden; text-align:right;}
#upform{ overflow:hidden; float:left;}
</style>
<body style="overflow:hidden;">
<div style="width:auto; height:100%; overflow:auto;" id="dv">
<table border="1" cellpadding="0" cellspacing="0" id="tb" width="100%" height="1000px">
<tr><td colspan="2" class="td_relative"><div id=mainform> <div id=upform>标题:</div>滚动条测试</div></td></tr>
<tr><td>1</td><td>2</td></tr> <tr><td>1</td><td>2</td></tr> <tr><td>1</td><td>2</td></tr> <tr><td>1</td><td>2</td></tr>
<tr><td>1</td><td>2</td></tr> <tr><td>1</td><td>2</td></tr><tr><td>1</td><td>2</td></tr><tr><td>1</td><td>2</td></tr>
<tr><td>1</td><td>2</td></tr><tr><td>1</td><td>2</td></tr><tr><td>1</td><td>2</td></tr><tr><td>1</td><td>2</td></tr>
<tr><td>1</td><td>2</td></tr></table></div></body>
td内容不换行：td{white-space:nowrap;}
table根据内容自动调整，使用div布局：<div><table></table></div>
