Table Component

A collection of built-in components designed to create styled, non-markdown (i.e., literal) HTML tables.

Props

Table

Name	Type	Default
`...props`	`DetailedHTMLProps<TableHTMLAttributes<HTMLTableElement>, HTMLTableElement>`

Tr

Name	Type	Default
`...props`	`DetailedHTMLProps<HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>`

Th

Name	Type	Default
`...props`	`DetailedHTMLProps<ThHTMLAttributes<HTMLTableHeaderCellElement>, HTMLTableHeaderCellElement>`

Td

Name	Type	Default
`...props`	`DetailedHTMLProps<TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>`

Example

Country	Flag
France	🇫🇷
Ukraine	🇺🇦

Usage


import { Table } from 'nextra/components'
 
<Table>
  <thead>
    <Table.Tr>
      <Table.Th>Country</Table.Th>
      <Table.Th>Flag</Table.Th>
    </Table.Tr>
  </thead>
  <tbody>
    <Table.Tr>
      <Table.Td>France</Table.Td>
      <Table.Td>🇫🇷</Table.Td>
    </Table.Tr>
    <Table.Tr>
      <Table.Td>Ukraine</Table.Td>
      <Table.Td>🇺🇦</Table.Td>
    </Table.Tr>
  </tbody>
</Table>