<section-title>

The <section-title> element represents the title of a group of <item> within a <section-list>. It renders as an optionally sticky element that stays at the top of the list while the user scrolls through items in that section.

<section-list style="List">
  <!-- Section 1 -->
  <section-title style="Header">
    <text>Section 1</text>
  </section-title>

  <item key="a" style="Item">
    <text>Item 1</text>
  </item>

  <!-- Section 2 -->
  <section-title style="Header">
    <text>Section 1</text>
  </section-title>

  <item key="b" style="Item">
    <text>Section 2</text>
  </item>
</section-list>

Structure

A <section-title> element can only appear as a direct child of a <section-list> or <items> element.

Attributes

• Behavior attributes
• style
• id
• hide

Behavior attributes

A <section-title> element accepts the standard behavior attributes. However, since <section-title> elements can only be children of scrollable <section-list> elements, the pull-to-refresh gesture will never trigger on a <section-title>. Thus, refresh triggers should only be added to the parent section list element.

style

Type	Required
string	No

A space-separated list of styles to apply to the element. See Styles.

id

Type	Required
string	No

A global attribute uniquely identifying the element in the whole document.

hide

Type	Required
false (default), true	No

If hide="true", the element will not be rendered on screen. If the element or any of the element's children have a behavior that triggers on "load" or "visible", those behaviors will not trigger while the element is hidden.