Tables are used to make large volumes of data easy to understand and to access.
|Web resource key:
|AMD Module key:
The following example shows the markup pattern required for AUI Tables.
You can use
aui-table-list CSS class. When present, this CSS class will:
:focus-within style to a row.
To make row "subtle" add
aui-row-subtle CSS class to any row.
Table element usage:
aui-table-list CSS class for table-based lists.
|Used to group table heading elements. All cells inside THEAD should be TH, not TD.
|Used for all table heading cells, either in THEAD for a top row, or as the first cell in a table with headings in the first column.
|Used to group table footer elements.
|Used to group together table content elements. Your table can include more than one TBODY, the start of each new TBODY will be emphasized with a slightly thicker border.
|Used in THEAD, TFOOT and TBODY to section table elements into rows.
aui-row-subtle CSS class for subtle row. Valid only if you add
aui-table-list CSS class for table
|Used in TBODY and TFOOT to display table contents.
|Used in table content elements to automatically remove bullets and float list items neatly to the left.