关于CSS显示属性如何处理表语义的简短说明

这些年来，我们多次在博客中发布响应式表 。 有多种技术，您应该根据表中的数据和要使用的UX选择哪种技术。 但是其中许多依赖于将表元素的自然显示值重置为其他值，例如display: block 。 史蒂夫·福克纳（Steve Faulkner）警告我们：

当在表元素上设置CSS display: block或display: grid或display: flex ，会发生不良情况。 该表在可访问性树中不再表示为表，行元素/语义不再以任何形式表示。

他认为浏览器在这里通过更改这些语义而犯了一个错误，但是既然这样做了，那么很高兴知道它可以（具有大量）ARIA角色来修复 。

这是来自Adrian Roselli的更多内容，包括带有适当标记的演示。

直接连结→

翻译自: https://css-tricks.com/short-note-on-what-css-display-properties-do-to-table-semantics/