2.Collapse Accordion

• button with collapse

<button class="btn btn-primary mb-3" data-toggle="collapse" data-target="#collapse-1">Read More</button>

<div class="collapse mb-5" id="collapse-1">
  <div class="card">
    <div class="card-body">
      Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugit eius libero quisquam nobis explicabo vel non
      necessitatibus
      ipsum doloribus cupiditate voluptate recusandae quo autem error debitis, sed, minima repellendus commodi.
    </div>
  </div>
</div>

• accordion

<div id="accordion1">
  <div class="card">
    <div class="card-header">
      <h5>
        <a href="#collapse1" data-toggle="collapse" data-parent="#accordion1">
          Collapse One
        </a>
      </h5>
    </div>

    <div id="collapse1" class="collapse show">
      <div class="card-body">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis ea iste a doloremque, cumque, debitis
        eum vel ipsum architecto
        aut, recusandae totam ullam aperiam. Nesciunt expedita officiis animi quam corporis optio inventore facilis
        sint
        et nulla in, repellat debitis dolor at nisi quo, unde temporibus. Quos nisi nostrum officia, illo.
      </div>
    </div>
  </div>

  <div class="card">
    <div class="card-header">
      <h5>
        <a href="#collapse2" data-toggle="collapse" data-parent="#accordion1">
          Collapse Two
        </a>
      </h5>
    </div>

    <div id="collapse2" class="collapse">
      <div class="card-body">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis ea iste a doloremque, cumque, debitis
        eum vel ipsum architecto
        aut, recusandae totam ullam aperiam. Nesciunt expedita officiis animi quam corporis optio inventore facilis
        sint
        et nulla in, repellat debitis dolor at nisi quo, unde temporibus. Quos nisi nostrum officia, illo.
      </div>
    </div>
  </div>

  <div class="card">
    <div class="card-header">
      <h5>
        <a href="#collapse3" data-toggle="collapse" data-parent="#accordion1">
          Collapse Three
        </a>
      </h5>
    </div>

    <div id="collapse3" class="collapse">
      <div class="card-body">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veritatis ea iste a doloremque, cumque, debitis
        eum vel ipsum architecto
        aut, recusandae totam ullam aperiam. Nesciunt expedita officiis animi quam corporis optio inventore facilis
        sint
        et nulla in, repellat debitis dolor at nisi quo, unde temporibus. Quos nisi nostrum officia, illo.
      </div>
    </div>
  </div>
</div>