Question

我有一个PHP数组，每行产生四列。反正强制HTML表每行显示8列吗？

例如，如果我的输出是：

<tr>
<td>COL 1</td>
<td>COL 2</td>
<td>COL 3</td>
<td>COL 4</td>
</tr>
<tr>
<td>COL 5</td>
<td>COL 6</td>
<td>COL 7</td>
<td>COL 8</td>
</tr>
<tr>
<td>COL 9</td>
<td>COL 10</td>
<td>COL 11</td>
<td>COL 12</td>
</tr>
<tr>
<td>COL 13</td>
<td>COL 14</td>
<td>COL 15</td>
<td>COL 16</td>
</tr>

显示屏如下：

COL 1 COL 2 COL 3 COL 4
COL 5 COL 6 COL 7 COL 8
COL 9 COL 10 COL 11 COL 12
COL 13 COL 14 COL 15 COL 16

无论如何，CSS或HTMl可以强制表在断开之前在一行上显示八列吗？那么创建这样的东西？

COL 1 COL 2 COL 3 COL 4      COL 5 COL 6 COL 7 COL 8
COL 9 COL 10 COL 11 COL 12   COL 13 COL 14 COL 15 COL 16

Answer 1

只需更改您的PHP以正确的方式格式化它或使用div并相应地设置它，但是如果其真正的表格数据ID使用表并修复您的PHP以表示您想要的。

在PHP中真的不是那么困难，例如你可以只有一个计数器，当该计数器％2 == 0时，然后完成该行并开始一个新的。相应地增加计数器。

伪码

目前你有类似的东西。

for($i = 0; $i < numRows; $i++) {
    output a <tr> tag

    output <td> tags and data

    output a closing </tr> tag
}

你需要做的就是这样。

for($i = 0; $i < numRows; $i++)  {
    if($i % 2 == 0)
        output startting <tr> tag

    output some <td> tags with data

    if(($i +1) % 2 == 0)
        output closing <tr> tag
}

Alternatley你可以使用布尔标志

is_even_row = ture;
for each row {
    if(is_even_row)
        output start tag

    output data for row

    if(not is_even_row)
        output end tag

    is_even_row = not is_even_row
}

Answer 2

解决此问题的正确方法是修复为您的目的生成错误HTML布局的PHP，即使用CSS，至少有一个选项：

table {
    disply: block;
    width: 90%;
    margin: 1em auto;
    border: 1px solid #000;
}

tr {
    display: block;
    width: 50%;
    float: left;
    margin: 0;
    padding: 0;
}

td {
    display: inline-block;
    width: 20%;
    border: 1px solid #000;
}

JS Fiddle demo

还有一个JavaScript解决方案（如果有的话）：

var table = document.getElementsByTagName('table')[0],
    rows = table.getElementsByTagName('tr');

for (var i=rows.length - 1; i>=0; i--){
    if (i%2 == 1 && i !== 0){
        var prev = rows[i].previousElementSibling;
        while (rows[i].firstChild){
            prev.appendChild(rows[i].firstChild);
        }
        rows[i].parentNode.removeChild(rows[i]);
    }
}

JS Fiddle demo

强制html表在一行上有八列

2 个答案: