Bootstrap 4 Collapse
Add collapsible content easily with Bootstrap's .collapse and related classes.
You can make your content collapsible by adding data-toggle="collapse" to either a button or a hyperlink.
The button or link references the ID of the content to collapse.
Using a Link
Use the <a> tag with an href value of the ID of the content to collapse.
On the collapsible content's container, add the .collapse class, and be sure to give it an ID.
Using a Button
Use the data-target attribute with a value of the ID of the content to collapse.
On the collapsible content's container, add the .collapse class, and be sure to give it an ID.
Accordion
Collapsible content is often used to make an "accordion". Accordions are popular for content such as FAQs, product overviews, etc
You can use Bootstrap cards to style the accordion like below.
Add the .show class to the collapsible content to have it expanded when the page loads. Also use aria-expanded="true" in this case.