html表格标签模板 实现跨行和跨列

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qq_38409944/article/details/80349349
网站首页显示页面
    1.表格标签
                <table border="" width="" height="" align="" bgcolor="" cellpadding="" cellspacing="">
                    <thead>
                        <tr>
                            <th></th>
                        </tr>
                    <thead>
                    <tbody>
                    <tr>
                        <td></td>
                        <td></td>
                        <td></td>
                    </tr>
                    <tr>
                        <td></td>
                    </tr>
                    <tr>
                        <td></td>
                    </tr>
                    </tbody>
                </table>
    2.跨行跨列操作
        跨行:rowspan
        跨列:colspan

举个栗子:

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>
        <table border="1">
            <thead>
                <tr colspan="2">
                    <th colspan="2">
                        <input type="checkbox"/>
                    </th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td rowspan="2"><input type="checkbox"></td>
                    <td >xx1</td>
                </tr>
                <tr>
                    <td>xx3</td>
                </tr>
                <tr>
                    <td><input type="checkbox"></td>
                    <td>xx4</td>
                </tr>
            </tbody>
        </table>
    </body>
</html>

效果图如下:
这里写图片描述

注意:
< th colspan=”2”> 实现跨2列
<td rowspan=”2”> 实现跨2行

阅读更多
想对作者说点什么?

博主推荐

换一批

没有更多推荐了,返回首页