colspan="1.5"失效，如何实现指定结构的HTML表格？

你的代码中colspan的逻辑设置是正确的，但浏览器渲染表格时，由于缺少明确的基础列数定义，会自动调整列宽导致布局混乱。只需在表格开头添加<col>标签明确指定6列，就能让所有colspan按预期工作：

<table border="1px" width="100%">
    <!-- 明确指定6列，作为colspan的计算基准 -->
    <col><col><col><col><col><col>
    <tr>
        <td colspan="6">Cell 1</td>
    </tr>
    <tr>
        <td colspan="3">Cell 2</td> 
        <td colspan="3">Cell 3</td>
    </tr>
    <tr>
        <td colspan="2">Cell 4</td> 
        <td colspan="2">Cell 5</td>            
        <td colspan="2">Cell 6</td> 
    </tr>
</table>

原理说明 #

添加<col>标签后，浏览器会明确表格的基础列数为6，所有colspan的计算都会基于这个固定列数，不会因为行内单元格数量变化而重新调整列结构，这样第二行和第三行的布局就不会互相干扰。

内容的提问来源于stack exchange，提问作者radziokoz