Alright, in this video, we're talking about the details on it and the summary element and how you can create your own accordion menus. First of all, we have the details tag, which is the block level element, and you'll put most of the content in that element. And we have the summary tag which goes within the details tag should be as short as makes sense. When rendered, the summary element will display with a triangle to its left, then you click on it and the triangle open up and show the content within. All right, let's see what this looks like. So again, here we have details.
Then we have the summary is the first title of details is the best practice. You should also only have one summary tag if you have multiple can confuse the browser. And then we close the details tag here after this whole deer diary. So if we come down here, we see that the summary tag right here is what's shown here and if I click on this, then it shows me all of the content here. If I click on it again, it closes I can click directly on the track. Or I can click on the text itself.
And there you have your accordion menus. Let's see what happens if we put a second one in here. entry. All right, if we put a second one in, it's just going to assume as part of the content. All right, that's it for accordion menus.