3

我最近一直在使用这些属性，尤其是display: table-cell。它在现代浏览器中得到了很好的支持，它对一些网格和对齐内容有很多好处，不需要复杂的标记。但是在过去的几天里，我看到人们在谈论这个，因为使用这些属性是一种不好的做法/方法，就像在这个答案中一样。

优点（我现在想到的）：

  • 不向 HTML 标记添加语义
  • 在现代浏览器中得到很好的支持
  • 有助于对齐内容
  • 有助于网格系统（最有可能结合对齐内容）

缺点

  • 如果您只使用display: table-cell;缺少的部分（行和表），则会自动添加

所以我真的不明白，为什么将它们用于布局会很糟糕。

我想这个问题已经结束（我可以理解），但也许有人有一个不错的答案——甚至对他们的使用持肯定态度。

4

3 回答 3

4

引用链接的答案：

不要忘记 table-cell 不是正确的用法。您不希望将图像视为表格单元格，因为表格单元格应该只包含表格数据。只是举起谨慎的旗帜。坚持语义。

我不会说这么长：CSS 与语义毫无关系。

于 2012-08-09T22:20:32.690 回答
1

我喜欢根据需要设置显示和位置，尽管我几乎总是设置任何大型元素，position: relative;这样我就可以更轻松地处理他们的孩子。

至于display:table-cell- 它只是改变它的布局方式。如果您只需要一个整洁的小 4x4 网格，而不是在桌子上编写完整的代码，为什么不使用它呢？它非常简单，非常干净，是对大（凌乱）表进行编码的非常非常简单的替代方案。

我的建议是“如果它没有坏，就不要修复它”。display:只会改变物品的显示方式...显示〜去图！

我display:根据需要使用尽可能多的 's，例如菜单可能:inline-block;用于媒体查询或:block完整文章，或者:table-cell用于侧边栏/文章部分的一个漂亮的简单甚至 2 列位。

于 2012-08-09T22:21:45.170 回答
1

一个积极的：提供表格布局而不使用表格元素。一个负面：对某些用户代理产生负面影响： http ://www.456bereastreet.com/archive/201110/using_displaytable_has_semantic_effects_in_some_screen_readers/ 这是“这一切都取决于......”问题之一。

于 2012-08-10T20:02:16.780 回答