Caption

Struct Caption 

Source
pub struct Caption;
Expand description

The <caption> element - represents the title of a table.

§Purpose

The <caption> element provides a title or caption for its parent <table>. It gives users context about the table’s content before they start reading the data. Must be the first child of the table if present. Screen readers announce captions to help users understand table purpose.

§Content Categories

  • None (only valid as first child of <table>)

§Permitted Content Model

  • Flow content (excluding table elements)

§Common Use Cases

  • Providing descriptive titles for data tables
  • Summarizing table content and purpose
  • Adding context for screen reader users
  • Labeling financial reports and statistics
  • Titling comparison and pricing tables

§Key Attributes

  • Global attributes only

§Example

<!-- Simple caption -->
<table>
  <caption>Employee Directory</caption>
  <thead>
    <tr>
      <th>Name</th>
      <th>Department</th>
      <th>Email</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>John Doe</td>
      <td>Engineering</td>
      <td>john@example.com</td>
    </tr>
  </tbody>
</table>

<!-- Caption with additional context -->
<table>
  <caption>
    <strong>Quarterly Sales Data</strong>
    <br>
    <small>Fiscal Year 2024</small>
  </caption>
  <thead>
    <tr>
      <th>Quarter</th>
      <th>Sales</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Q1</td>
      <td>$50,000</td>
    </tr>
  </tbody>
</table>

<!-- Styled caption -->
<table>
  <caption style="caption-side: bottom;">
    Table 1: Customer satisfaction ratings by region
  </caption>
  <thead>
    <tr>
      <th>Region</th>
      <th>Rating</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>North</td>
      <td>4.5/5</td>
    </tr>
  </tbody>
</table>

§Accessibility

  • Always provide a caption for data tables
  • Keep captions concise but descriptive
  • Screen readers announce captions before table content
  • Use CSS caption-side property for visual positioning

§WHATWG Specification

Trait Implementations§

Source§

impl HtmlElement for Caption

Source§

const TAG: &'static str = "caption"

The HTML tag name (e.g., “div”, “span”, “img”).
Source§

const VOID: bool = false

Whether this is a void element (self-closing, no children allowed).
Source§

impl CanContain<Caption> for Table

Source§

impl<T: FlowContent> CanContain<T> for Caption

Source§

impl CanContain<Text> for Caption

Auto Trait Implementations§

Blanket Implementations§

Source§

impl<T> Any for T
where T: 'static + ?Sized,

Source§

fn type_id(&self) -> TypeId

Gets the TypeId of self. Read more
Source§

impl<T> Borrow<T> for T
where T: ?Sized,

Source§

fn borrow(&self) -> &T

Immutably borrows from an owned value. Read more
Source§

impl<T> BorrowMut<T> for T
where T: ?Sized,

Source§

fn borrow_mut(&mut self) -> &mut T

Mutably borrows from an owned value. Read more
Source§

impl<T> From<T> for T

Source§

fn from(t: T) -> T

Returns the argument unchanged.

Source§

impl<T, U> Into<U> for T
where U: From<T>,

Source§

fn into(self) -> U

Calls U::from(self).

That is, this conversion is whatever the implementation of From<T> for U chooses to do.

Source§

impl<T, U> TryFrom<U> for T
where U: Into<T>,

Source§

type Error = Infallible

The type returned in the event of a conversion error.
Source§

fn try_from(value: U) -> Result<T, <T as TryFrom<U>>::Error>

Performs the conversion.
Source§

impl<T, U> TryInto<U> for T
where U: TryFrom<T>,

Source§

type Error = <U as TryFrom<T>>::Error

The type returned in the event of a conversion error.
Source§

fn try_into(self) -> Result<U, <U as TryFrom<T>>::Error>

Performs the conversion.