屏幕阅读器的表格样式输入

时间:2016-02-15 11:36:42

标签: html wcag2.0

看看这个image。 我有一个包含输入的表。每个输入由列标题单元格和行标题单元格定义。您如何确保盲人用户知道每个输入字段中键入的内容?

让我们使用以下简化的html表作为示例:

<table border="1">
  <tr>
    <th></th>
    <th>Income</th>
    <th>Change</th>
  </tr>
  <tr>
    <th>Personal income</th>
    <td><input type="number" value="0"></td>
    <td><input type="number" value="0"></td>
  </tr>
  <tr>
    <th>Company earnings</th>
    <td><input type="number" value="0"></td>
    <td><input type="number" value="0"></td>
  </tr>
</table>

https://jsfiddle.net/vzr6rmzx/

1 个答案:

答案 0 :(得分:0)

答案由W3在例3中描述: following

基本上你需要使用隐藏的fieldset,legends和label。该示例使用隐藏标签的类,但我建议您考虑仅由屏幕阅读器(和其他辅助技术)读取但视觉上隐藏的aria-label标签。