Skip to Main Content

Library Services

web-components

bs-accordion

Bootstrap accordion webcomponent demo

First Accordion Item (Title via <h3>)

This is the body of the first item. It is open by default because it's the first item.

You can place any valid HTML content here, such as text, lists, images, or even other components (though nesting web components requires careful consideration).

Second Accordion Item (Title via <span>)

This is the body of the second item.

  • Content can be varied.
  • Like a list.

The web component internally generates unique IDs for all necessary Bootstrap parts.

Tenth Accordion Item (Title via <h4> with index 10)

This is the body of the item with index "10". It will appear after items with lower indices.

Placeholder

Third Accordion Item (Title via <h3> with index 3)

This is the body of the item with index "3".

The component uses crypto.randomUUID() for generating unique identifiers.

Below is typical bs accordion single panel test

Single Item Only

This accordion instance demonstrates a single item. It will be open by default.