<table>的基本使用

Sian · 发表于 2015-7-10 17:37:15

一、先看效果：

正常表格

1-1
1-2
1-3

2-1
2-2
2-3

3-1
3-2
3-3
合并表格1

1-1

2-1
2-2
2-3

3-1
3-2
合并表格2

1-1
1-2

2-1
2-2
2-3

3-1
3-3

二、Html实现

[HTML] 纯文本查看 复制代码

<html>
        <head>
        </head>
        <body>
                <ol>
                        <li>正常表格</li>
                                <table border="1" width="600" align="center" cellpadding="20" cellspacing="0">
                                        <tr>
                                                <td>1.1</td>
                                                <td>1.2</td>
                                                <td>1.3</td>
                                        </tr>
                                        <tr>
                                                <td>2.1</td>
                                                <td>2.2</td>
                                                <td>2.3</td>
                                        </tr>
                                        <tr>
                                                <td>3.1</td>
                                                <td>3.2</td>
                                                <td>3.3</td>
                                        </tr>
                                </table>
                        <br />
                        
                        <li>合并表格1</li>
                                <table border="1" width="600" align="center" cellpadding="20">
                                        <tr>
                                                <td colspan="3" align="center" valign="top" height="100">1.1</td>
                                        </tr>
                                        <tr>
                                                <td rowspan="2" align="center" valign="bottom">2.1</td>
                                                <td>2.2</td>
                                                <td>2.3</td>
                                        </tr>
                                        <tr>
                                                <td>3.1</td>
                                                <td>3.2</td>
                                        </tr>
                                </table>
                        <br />
                        
                        <li>合并表格2</li>
                                <table border="1" width="600" align="center" cellpadding="20">
                                        <tr>
                                                <td>1.1</td>
                                                <td colspan="2">1.2</td>
                                        </tr>
                                        <tr>
                                                <td>2.1</td>
                                                <td rowspan="2">2.2</td>
                                                <td>2.3</td>
                                        </tr>
                                        <tr>
                                                <td>3.1</td>
                                                <td>3.3</td>
                                        </tr>
                                </table>
                        
                </ol>

        </body>
</html>

帐号		自动登录	找回密码
密码			立即注册