欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

html表格

程序员文章站 2022-07-06 23:28:53
...
1. html表格

1) 表格的基本结构

<table border="1">
    <tr>
        <th>1</th><th>2</th><th>3</th><th>4</th>
    </tr>
    <tr>
        <td>1-1</td><td>1-2</td><td>1-3</td><td>1-4</td>
    </tr>
    <tr>
        <td>2-1</td><td>2-2</td><td>2-3</td><td>1-4</td>
    </tr>
    <tr>
        <td>3-1</td><td>3-2</td><td>3-3</td><td>3-4</td>
    </tr>
</table>


2) 合并单元格

2.1 用colspan属性左右合并单元格
2.2 用rowspan属性上下合并单元格

<table border="1">
    <tr>
        <th>1</th><th>2</th><th>3</th><th>4</th>
    </tr>
    <tr>
        <td colspan="2">1-1-2</td><td>1-3</td><td>1-4</td>
    </tr>
    <tr>
        <td>2-1</td><td rowspan="2">3-2-2</td><td>2-3</td><td>1-4</td>
    </tr>
    <tr>
        <td>3-1</td><td>3-3</td><td>3-4</td>
    </tr>
</table>


3) 用align属性设置对齐方式

<tr align="center"></tr>

<td rowspan="2" align="center">3-2-2</td>


4) 用bgcolor属性设置表格背景色和边框颜色

<table border="1" width="400" bgcolor="red"><table>

<td rowspan="2" align="center" bgcolor="green">3-2-2</td>


5) 用cellpadding属性和cellspacing属性设定边距

5.1 cellspadding属性设定表格单元格中的内容距离格线的距离
5.2 cellspacing属性设定表格相邻单元格边线之间的距离

<table border="1" width="400" bgcolor="red" cellpadding="20px;" cellspacing="20px;"><table>
相关标签: html