Bootstrap 5 Collapse

Bootstrap 5 is the latest major release by Bootstrap in which they have revamped the UI and made various changes. Collapse is used to toggle the visibility of content across your project with a few classes and the JavaScript plugins which comes with Bootstrap 5. The working of collapse component is based on class changes which are applied. For example, .collapse to hide the content .collapsing is applied during transitions and .collapse.show shows the content.
Syntax:

<div class="collapse"> Contents... <div>

Example 1: This example uses show the working of collapsible div with button and link in Bootstrap 5.

Output:

👁 Image
 
Example 2: This example uses show the working of collapsible cards in Bootstrap 5.

Output:

👁 Image
Example 3: This example uses show the working of multiple collapsible divs in Bootstrap 5.

Output:

👁 Image