diff --git a/files/zh-cn/web/accessibility/aria/attributes/aria-colcount/index.md b/files/zh-cn/web/accessibility/aria/attributes/aria-colcount/index.md new file mode 100644 index 00000000000000..138e04405931b3 --- /dev/null +++ b/files/zh-cn/web/accessibility/aria/attributes/aria-colcount/index.md @@ -0,0 +1,90 @@ +--- +title: aria-colcount +slug: Web/Accessibility/ARIA/Attributes/aria-colcount +l10n: + sourceCommit: 019ca5c9ce641bfa02825e1ba0444f35dfb646cc +--- + +{{AccessibilitySidebar}} + +`aria-colcount` 属性定义了当所有列都不在 [DOM](/zh-CN/docs/Glossary/DOM) 中时,在 [`table`](/zh-CN/docs/Web/Accessibility/ARIA/Roles/table_role)、[`grid`](/zh-CN/docs/Web/Accessibility/ARIA/Roles/grid_role) 或 [`treegrid`](/zh-CN/docs/Web/Accessibility/ARIA/Roles/treegrid_role) 中的列总数。 + +## 描述 + +一些表格非常庞大,不可能向用户展示所有列。或者,虽然可能,但是拥有如此宽的表格将会给用户带来糟糕的用户体验。使用 `aria-colcount` 属性让辅助技术知道如果所有列都存在的话,表格会有多少列。该值是一个整数,表示组成完整表格的列数。如果你不知道表格将具有的总列数,但知道它们不会全部存在于 DOM 中,则使用值 -1,因此 `aria-colcount="-1"`。该值告诉用户代理,当前存在于 DOM 中的列数可能不是表格中的实际列数。 + +如果表格中的所有列都存在于 DOM 中,则不需要 `aria-colcount` 属性,因为浏览器会自动计算列的总数。但是,如果在给定时刻只有一部分列存在于 DOM 中,那么这个属性就很有用并且是必需的。 + +当使用 `aria-colcount` 时,如果你知道列的数量,请确保还使用 [`aria-colindex`](/zh-CN/docs/Web/Accessibility/ARIA/Attributes/aria-colindex) 为每列标记,或者如果列是连续的,即它们是原始顺序中没有中断的一组列,则为每行标记。 + +以下示例显示了一个网格,具有 6 列,其中列 1、2、5 和 6 显示给用户。将表格本身设置为 `aria-colcount="6"`,表示组成表格的列的总数。由于列不是连续的,因此在本例中每个[单元格](/zh-CN/docs/Web/Accessibility/ARIA/Roles/cell_role)的 [`columnheader`](/zh-CN/docs/Web/Accessibility/ARIA/Roles/columnheader_role) 和 [`gridcell`](/zh-CN/docs/Web/Accessibility/ARIA/Roles/gridcell_role) 元素都设置了 `aria-colindex` 属性。 + +```html +
名字 | +姓氏 | +城市 | +邮编 | +
---|---|---|---|
Debra | +Burks | +纽约 | +14127 | +