HTML:GettingTabular

本章介绍如何用HTML的元素建立表格，语句如下：

<table>
    <caption>
    </caption>
    <tr>
        <th>...</th>
            ...
    </tr>
    <tr>
        <td>...</td>
            ...
    </tr>
</table>

其中，tr表示table row，th表示table heading，td表示table data。

html只能按照row来录入数据；这里的第一行是heading，如果我们要让第一列是heading，只要在每一个row里面填入一个对应的th；

- 每一行的td要和th一样多，就算是缺失值也要用写入

<td></td>

；

border-spacing:
border-collapse : collapse可以使每个单元格间的边界消除

nth-child psuedo-class:
假设一个section里面有很多p

<section>
    <p></p>
    <p></p>
    <p></p>
    <p></p>
</section>

要使相邻行颜色不同

p:nth-child(even) {
background-color: red;
}

p:nth-child(odd) {
background-color: green;
}

即奇数行使用红色背景色，偶数行使用绿色背景色。也可以用下面的代码：

p:nth-child(2n+1) {
    background-color: red;
}

p:nth-child(2n) {
    background-color: green;
}

但是这种用法不局限于奇偶行，还可以有更广泛的运用。

td元素里的参数rowspan/colspan可以控制单元格的合并

改变无序列表每一项前面的小黑圈，用喜欢的图片代替，需要用到CSS的list-style-image

li {
    list-style-image: url(images/backpack.gif);
    padding-top: 5px;
    margin-left: 20px;
}

有序列表无法使用图片，但是和无序列表一样可以用list-style-type来改变样式