Columnheader Role

Previous Checkbox role

To form a logical relation between the headers and the corresponding data in data tables <th> tags are used. These <th> tags are supported with HTML scope attribute. scope=”col” form a relation between column header and its corresponding data. In certain scenarios use of <th scope=”col”> might not be possible. Usage of role=”columnheader” helps in these situations. Role=”rowheader” does the same functionality for <th scope=”row”>. Screen readers like JAWS and NVDA will recognize the columnheader (role) and rowheader(role).

<table summary=”Marks of students for class IX”>
<td role=”columnheader”>Names</td>
<td role=”columnheader”>Mathematics</td>
<td role=”columnheader”>Physics</td>
<td role=”columnheader”>Chemistry</td>
<td role=”rowheader”>Student A</td>
<td role=”rowheader”>Student B</td>
<td role=”rowheader”>Student C</td>
Next Combobox role

Share and Enjoy !

0 0

Leave a comment

Your email address will not be published. Required fields are marked *

Contact Us

Maxability Pvt Ltd Flat 360,
Block D2 SLS Signature Appartments,
Kaverappa Layout, Kadubeesanahalli,
Bangalore - 560103.