---
title: Table Appearance
tbl-cap-location: bottom
format: html
_quarto:
  tests: 
    html:
      ensureHtmlElements:
        - ['table tbody tr.odd', 'table tbody tr.even']
        - ['table tbody tr:not(.odd):not(.even)'] # All table should have .odd .even class for styling 
---

### Md table (w/caption) {#captioned}

A short sentence that makes a paragraph.

| Default | Left | Right | Center |
|---------|:-----|------:|:------:|
| 12      | 12   |    12 |   12   |
| 123     | 123  |   123 |  123   |
| 1       | 1    |     1 |   1    |

: Demonstration of pipe table syntax

### fancy table

A short sentence that makes a paragraph.

| fruit  | price  |
|--------|--------|
| apple  | 2.05   |
| pear   | 1.37   |
| orange | 3.09   |

: Fruit prices {.striped .hover}


### xref table

A short sentence that makes a paragraph.

| Col1 | Col2 | Col3 |
|------|------|------|
| A    | B    | C    |
| E    | F    | G    |
| A    | G    | G    |

: My Caption {#tbl-letters}

See @tbl-letters.

### subtables

A short sentence that makes a paragraph.

::: {#tbl-panel layout-ncol=2}
| Col1 | Col2 | Col3 |
|------|------|------|
| A    | B    | C    |
| E    | F    | G    |
| A    | G    | G    |

: First Table {#tbl-first}

| Col1 | Col2 | Col3 |
|------|------|------|
| A    | B    | C    |
| E    | F    | G    |
| A    | G    | G    |

: Second Table {#tbl-second}

Main Caption
:::

See @tbl-panel for details, especially @tbl-second.

### HTML Table

```{=html}
<table>
  <caption>As described in the section above, Quarto tables are great.</caption>
  <thead>
    <tr>
      <th>Header 1</th>
      <th>Header 2</th>
    </tr>
  </thead>
  <tbody>
    <tr>
    <td>First Column</td>
    <td>Second Column</td>
    </tr>
  </tbody>
</table>
```