html - 如何在html中自定义宽度列

Question

我想在下面的 html 表格行中有不同数量的列是我想要实现但尚未成功的结构。请指导我实现这一目标

                   <tr>
                       <td>              
                       </td>
                       <td>
                       </td>
                   </tr>
                   <tr>
                       <td width="33%">              
                       </td>

                       <td width="33%">
                       </td>

                       <td width="33%">
                       </td>
                   </tr>
                   <tr>
                       <td>              
                       </td>
                       <td>
                       </td>
                   </tr>

Answer 1

试试这个方法

<table cellpadding="0" cellspacing="0">
<tr>
    <td>
        <table cellpadding="0" cellspacing="0" class="innerTable" border="0">
            <tr>
                <td>50%</td>
                <td>50%</td>
            </tr>
        </table>
    </td>

</tr>
<tr>
    <td>
        <table cellpadding="0" cellspacing="0" class="innerTable" border="0">
            <tr>
                <td>33%</td>
                <td>33%</td>
                <td>33%</td>
            </tr>
        </table>
    </td>


</tr>
<tr>
    <td>
        <table cellpadding="0" cellspacing="0" class="innerTable" border="0">
            <tr>
                <td>50%</td>
                <td>50%</td>
            </tr>
        </table>
    </td>

</tr>

CSS

table{
  width:100%;
  border:0px solid #ddd;

}
table.innerTable td{
  border:1px solid #999;
}

https://jsfiddle.net/8j1ptbty/3/