In this example we've created a collapsible panel when the heading is clicked.
A panel appears it disappears when the heading is clicked again
we can create a collapsible panel by creating a div and setting the class value to panel group inside
that if we create another div with two classes panel in panel primary
next we create a div with the class panel heading we can insert our title Inside this div here.
We've used an H for element in this example it contains the class panel title
Inside the H for element.
We have our 8 element with a data toggle attribute set to collapse.
We also have a H R F attribute and this is set to the name of the div that contains the panel content.
That div can be found here.
You can see that the I.D. matches the H R F attribute in the element.
We also have two classes attached to this div panel collapse and collapse.
Next we have two divs one with the panel body class and the other with the panel footer class as you
learned earlier these contain the body content and footer content for the panel.
You can insert whatever body content you want here in the footer content here.