Back to Vuetify

Tables

packages/docs/src/pages/en/components/tables.md

4.1.21.3 KB
Original Source

Tables

The simpler of the table components is v-table, a basic wrapper component for the HTML <table> element. In addition, regular table elements such as <thead>, <tbody>, <tr>, and <td> work by default.

::: info More advanced tables such as v-data-table are available. :::

<PageFeatures />

Usage

<ExamplesExample file="v-table/usage" /> <PromotedEntry />

API

ComponentDescription
v-tablePrimary Component
<ApiInline hide-links />

Examples

Props

Theme

Use theme prop to switch table to another theme.

<ExamplesExample file="v-table/prop-dark" />

Density

You can show a dense version of the table by using the density prop.

<ExamplesExample file="v-table/prop-dense" />

Height

Use the height prop to set the height of the table.

<ExamplesExample file="v-table/prop-height" />

Fixed header

Use the fixed-header prop together with the height prop to fix the header to the top of the table.

<ExamplesExample file="v-table/prop-fixed-header" />

Striped

By applying the striped prop, you can have a background applied to either the even or odd rows of the table. Color can be further adjusted using sass variables.

<ExamplesExample file="v-table/prop-striped" />