css - '显示：表格；' 在容器和 'display:table-cell;' 对孩子？

Question

可以display: table;在容器元素display: table-cell;及其子元素上使用，还是应该有一个display: table-row;中间的包装器？

我是说...

<div style="display: table;">
   <div style="display: table-cell;"></div>
   <div style="display: table-cell;"></div>
</div>

或者

<div style="display: table;">
   <div style="display: table-row;">
      <div style="display: table-cell;"></div>
      <div style="display: table-cell;"></div>
   </div>
</div>

display: table-row;当您有多行时才有意义。但就我而言，我仅将它用于多列响应式布局（这显然意味着单行），因为它比使用float或其他东西更简单。

所以，问题是，对于单行多列布局，是否可以display: table;在容器元素display: table-cell;及其子元素上设置中间没有display: table-row;包装器？

我见过一些网站这样做（即他们不使用display: table-row;）。这是一个例子。

Answer 1

将在您的外部（表格）中生成一个匿名表格行框div以包含所有内部divs（表格单元格），因此如果您知道您希望所有表格单元格属于同一行，这是完全可以接受的。