table常用功能总结

1，设置表格边框为单线框

table, th, td
{
border: 1px solid blue;
}
加上：
table
{
border-collapse:collapse;
}

由于 table、th 以及 td 元素都有独立的边框，设置border会使表格具有双线条边框，
如果需要把表格显示为单线条边框，请使用 border-collapse 属性。
border-collapse:collapse; 说的是 边框折叠情况:折叠。

2，设置单元格td的宽度不起作用
加上：
table
{
table-layout:fixed;
}
(1)
table-layout:fixed 固定表格布局
水平布局仅取决于表格宽度、列宽度、表格边框宽度、单元格间距，而与单元格的内容无关。
(2)
table-layout:automatic 自动表格布局
默认。列宽度由单元格内容设定。这就是导致设置td宽度不起作用的原因。

3，
table设置标题位置在表格下面。
<table border="1">
<caption>This is a caption</caption>
<tr>
<td>Adams</td>
<td>John</td>
</tr>
</table>

caption
{
caption-side:bottom
}

4，隐藏表格中空单元格上的边框和背景
table
{
border-collapse:separate;
empty-cells:hide;
}
empty-cells 属性设置是否显示表格中的空单元格（仅用于“分离边框”模式）。

5，设置table偶数行样式
#customers tr.alt td
{
color:#000000;
background-color:#EAF2D3;
}