Easy learning with example program codes

Bootstrap collapsible List Group Tutorial

The .collapse class is used for bootstrap collapse functionality. Bootstrap collapse is used when we want to hide and show large amount of content.

Bootstrap Collapsible List Group Example:

<!DOCTYPE html>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="">
  <script src=""></script>
  <script src=""></script>
<div class="container">
  <h2>Bootstrap Collapsible List Group Example</h2>
  <div class="panel-group">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">
          <a data-toggle="collapse" href="#collapse1">Collapsible list group</a>
      <div id="collapse1" class="panel-collapse collapse">
        <ul class="list-group">
          <li class="list-group-item">One</li>
          <li class="list-group-item">Two</li>
          <li class="list-group-item">Three</li>
        <div class="panel-footer">Footer</div>

Try it:

JS Bin on

Please follow and like us:

Bootstrap 3 Tutorial

Copyright © 2020 CodesJava Protection Status