如何仅通过css和html在每行中创建4个单元格

我想问的是，如何在不使用编程语言的情况下，在每行中自动生成4个单元格​​比如php。 换句话说，我希望该行不可能超过4个单元格，并且任何新单元格都自动位于新行中，而无需手动输入代码

---

这是HTML

假设您有这样一个表标记：

<table>
    <tr>
        <td>Cell 1</td>
        <td>Cell 2</td>
        <td>Cell 3</td>
        <td>Cell 4</td>
        <td>Cell 5</td>
        <td>Cell 6</td>
        <td>Cell 7</td>
        <td>Cell 8</td>
        <td>Cell 9</td>
        <td>Cell 10</td>
    </tr>
</table>

编辑：

如果您希望每个td占据表格宽度的25%，则需要在表格上设置一个宽度，然后在所有td元素上设置宽度：25%，并将脱脂边距/填充重置为0

像这样：

---

假设要为页面创建布局，并将其用作块的行/行的同义词，而不是用于创建由表组成的布局表，tr和td或更糟的是，对于数据表，通常每行有4个单元格的数据表在第一行中也有4个标题单元格th，并且使用tr从语义上指示行的位置以及它们各自包含的单元格数量

也就是说，您可以在HTML代码中使用同级元素并浮动它们。这里有一个

相关代码：

HTML

---

如果您希望每行有四个单元格，请在该行中放置四个单元格。你被困在哪里了？所以我写的时候没有手动输入代码，没有编程语言是不行的。那么你准备放弃哪一个约束条件呢？我有一个变量是重复的，我想把每一个都放在一个单元格中，而这4个单元格只在一行中，不能使用宽度或任何东西来完成，如果没有phpp，请显示当前的html结构是的，我已经知道了，但是，当我拥有10个单元格时，我希望它们在每行中自动分割成4个单元格，如何分割？啊，好的，我明白了，就我所知，纯HTML和CSS无法做到这一点。需要一点javascriptIE，没有叫做最大单元格的属性，我对java不太了解：是的，我的意思是java ScriptHnx对于你的工作来说，我找到了简单的代码，并按照我想要的方式工作，如果我想给每个宽度25%？！

<table>
    <tr>
        <td>Cell 1</td>
        <td>Cell 2</td>
        <td>Cell 3</td>
        <td>Cell 4</td>
        <td>Cell 5</td>
        <td>Cell 6</td>
        <td>Cell 7</td>
        <td>Cell 8</td>
        <td>Cell 9</td>
        <td>Cell 10</td>
    </tr>
</table>

td {
    float: left;
}
td:nth-child(4n + 5) {
    clear:left;
}

body, td {
    margin: 0;padding:0;
}
table {
    width: 100%;
}
td {
    float: left;
    width: 25%;
}

<div class="block">Some content 1</div>
<div class="block">Some content 2</div>
<!-- (...) -->

* {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}
body {
    width: 400px;
}
.block {
    float: left;
    width: 24%;
    margin: 0 1% 1% 0;
    padding: 4px;
    border: 1px solid #aaa;
}

/* Improvements for last "row" http://slides.com/heydon/effortless-style#/45 and next slides */
.block:nth-child(4n+1):last-child {
    width: 99%;
}
.block:nth-child(4n+1):nth-last-child(2),
.block:nth-child(4n+2):last-child {
    width: 49%;
}
.block:nth-child(4n+1):nth-last-child(3),
.block:nth-child(4n+2):nth-last-child(2),
.block:nth-child(4n+3):last-child {
    width: 32%;
}