Question

桌子看起来像这样吗？

+---------------+
|   |   |   |   |
+---------------+
|     |   |     |
+---------------+
|   |   |   |   |
+---------------+

如果我这样做

<table>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
    </tr>
    <tr><td>
        <table>
            <tr>
                <td>a</td>
                <td>b</td>
                <td>c</td>
            </tr>
        </table>
        </td></tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
    </tr>
</table>

然后abc只插入一个<td>。

这个jdfiddle显示问题

http://jsfiddle.net/littlesandra88/EskrV/

如果可能的话，如何制作这样的表？

Answer 1

使用3列表向colspan添加<td>。

更新了小提琴：http://jsfiddle.net/EskrV/18/

<table>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
    </tr>
    <tr><td colspan="4">
        <table>
            <tr>
                <td>a</td>
                <td>b</td>
                <td>c</td>
            </tr>
        </table>
        </td></tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
    </tr>
</table>

Answer 2

你可以做到

<table>
    <tr>
        <td colspan=3>1</td>
        <td colspan=3>2</td>
        <td colspan=3>3</td>
        <td colspan=3>4</td>
    </tr>
    <tr>
        <td colspan=4>a</td>
        <td colspan=4>b</td>
        <td colspan=4>c</td>
    <tr>
        <td colspan=3>1</td>
        <td colspan=3>2</td>
        <td colspan=3>3</td>
        <td colspan=3>4</td>
    </tr>
</table>

Answer 3

当然你可以：http://jsfiddle.net/XqKRR/（没有嵌套表格）但是我有这种感觉，你试图使用表格来表示不是表格数据的东西，对吗？如果是这样，也许一个CSS和display: table[-row|-cell]将是一个更好的灵魂？

Answer 4

您可以使用嵌套的＆lt; div＆gt;然后使用css设置每个div的宽度。

桌子看起来像这样吗？

4 个答案: