Accordions are useful when you want to hide and show large amount of content
HTML markup
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<div id="accordion" class="panel-group"> <div class="panel panel-default"> <div class="panel-heading"> <h4 class="panel-title"> <a class="" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">How do I know which auto service to trust?</a> </h4> </div> <div id="collapseTwo" class="panel-collapse collapse in"> <div class="panel-body"> <p>Praesent auctor velit nec libero volutpat, vel pellentesque arcu tincidunt. Phasellus nec nisi imperdiet, tincidunt mi et, rhoncus nisl. Nullam sed leo ut lacus aliquam venenatis ut vestibulum felis. Nulla bibendum diam eu tortor faucibus molestie. Pellentesque venenatis rhoncus volutpat. Fusce ut sodales est, turpis. Donec eget feugiat est lacus tincidunt gravida quis felis rhoncus.</p> </div> </div> </div> </div> |
Screenshot