代码之家 › 专栏 › 技术社区 › Geo

可以将th与显示器flex和colspan一起使用吗?

flexbox html-table css html

1

Geo · 技术社区 · 7 年前

我有以下简化代码笔: https://codepen.io/anon/pen/LzoNNm

基本上,我有:

.flex {
  display: flex;
  flex-direction: row
}

<table>
  <thead>
    <tr>
      <th class="flex" colspan="3">This should stretch</th>
    </tr>
    <tr>
      <th>col 1</th>
      <th>col 2</th>
      <th>col 3</th>
    </tr>

  </thead>
</table>

th 不会延伸到全宽,但似乎与 col 1 在下一行。为什么第一个 第 不全宽?

1 回复 | 直到 7 年前

1

3

Ilya Streltsyn 7 年前

不,不幸的是,这不可能。当您更改 display 对于表的任何部分,您都可以有效地将其从表结构中删除(就像它是一个 div 元素)和表布局算法开始使用 anonymous table elements td 不再是表格单元,浏览器必须用匿名表格单元包装它,匿名表格单元不能有任何非默认样式或属性,因此它的行为就像一个没有跨距的单元格。