Close

Collapsible Accordion

This is an example of a collapsible accordion, designed using CSS, HTML, and Bootstrap framework 4. The form is designed to reveal the hidden text in a panel, on a button click. The form consists of six panels. An accordion button with the data-target attribute has been used to implement the collapsible feature of the accordion by using the data-toggle="collapse". The expanded panel is given a background color as #4385f5, and line-height as 24px. The non-expanded panel has the styles of color as #999999, background-color as #fff, display as block, padding as 12px 20px. The content section of the expanded panel is given a text size of 14px, whereas the expanded panel title is given a font-size as 16px. When expanded, the color of the text gets changed to #fff. The content section of the expanded panel is also given the styles of font-family as 'FontAwesome, width, and height as 21px, display as block, border-radius as 50% and text-align as center. Source: https://bbbootstrap.com/snippets/awesome-accordian-collapse-blue-93531626

Post Comment or Questions

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Your email address will not be published. Required fields are marked *

Several Related Snippets

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.