2

我正在尝试使用 rowspan 和 colspan 使用 HTML 中的表格创建此布局,但单元格的大小未显示我的预期,单元格“X”的 rowspan 和 colspan 的值为“2”,但表格的创建方式如下它在哪里 2x1。

这是我的代码

<html>
<head>
</head>
<body>
    <table border="3" cellspacing="5" cellpadding="3">
        <tbody>
            <tr>
                <td rowspan="2">1</td>
                <td>2</td>
                <td rowspan="2" colspan="2">X</td>
            </tr>

            <tr>    
                <td>3</td>      
            </tr>

            <tr>
                <td rowspan="1" colspan="4">4</td>  
            </tr>

            <tr>
                <td colspan="3">5</td>
                <td>6</td>  
            </tr>

        </tbody>
    </table>
</body>

4

1 回答 1

1

这工作正常。最容易查看是否添加了所有四个单元格都占据一列的行:

<tr>
    <td>7</td>
    <td>8</td>
    <td>9</td>
    <td>10</td>
</tr>

http://jsfiddle.net/ExplosionPIlls/HfHBU/

您面临的视觉问题是由于没有第三列单元格来创建任何宽度。整个第三列是由colspanX、4 和 5 上的 s 创建的,因此它看起来没有(或非常小的)宽度,如果没有宽度规则,单元格将不会扩展。

于 2013-03-17T00:56:50.053 回答