Table

A table is a structured arrangement of data presented in rows and columns. It is used to organize and display information in a clear and concise manner, making it easier for the reader to understand and compare the data.

Anatomy

• Table - A component that wraps the table.
• Rows - A row that can contain column headers or data cells for each column.
• Data - A cell within the table that contains the data.

Component

<alliance-table>
    <alliance-tr>
        <alliance-th label="Name"></alliance-th>
        <alliance-th label="Text"></alliance-th>
        <alliance-th label="Text"></alliance-th>
        <alliance-th label="Text"></alliance-th>
    </alliance-tr>
    <alliance-tr clickable>
        <alliance-td>One</alliance-td>
        <alliance-td>Two</alliance-td>
        <alliance-td>Three</alliance-td>
        <alliance-td>Four</alliance-td>
    </alliance-tr>
    <alliance-tr>
        <alliance-td>One</alliance-td>
        <alliance-td>Two</alliance-td>
        <alliance-td>Three</alliance-td>
        <alliance-td>Four</alliance-td>
    </alliance-tr>
    <alliance-tr>
        <alliance-td>One</alliance-td>
        <alliance-td>Two</alliance-td>
        <alliance-td>Three</alliance-td>
        <alliance-td>Four</alliance-td>
    </alliance-tr>
    <alliance-tr>
        <alliance-td>One</alliance-td>
        <alliance-td>Two</alliance-td>
        <alliance-td>Three</alliance-td>
        <alliance-td>Four</alliance-td>
    </alliance-tr>
    <alliance-tr>
        <alliance-td>One</alliance-td>
        <alliance-td>Two</alliance-td>
        <alliance-td>Three</alliance-td>
        <alliance-td>Four</alliance-td>
    </alliance-tr>
</alliance-table>