Article introduction of Wulin.com (www.vevb.com): The emergence of the details tag has brought us a better user experience, and there is no need to write JS for this shrinking and unfolding effect to achieve it.
The emergence of details tags has brought us a better user experience, and there is no need to write JS for this shrinking and unfolding effect to achieve it.Note: Currently only Chrome supports this tag.
details have a newly added subtitle - summary. When the mouse clicks on the content text in the summary tag, all other elements in the details tag will expand or shrink.
Detalis tag:
Case 1:
What happens if the summary tag does not exist in details? In fact, when there is no summary tag in the details element, the browser will provide a default text when parsing, such as localized text such as detailed and other localized text, and the browser will also provide an icon such as up and down arrows. For example, Case 2 below is an example where there is no summary sub-label.
Case 2:
Sometimes, what should we do if the content in detalis defaults to the expanded state?
In fact, HTML5 has also come up with us. If there are any requirements, we only need to add one attribute, such as Case 3.
Open properties:
Modify the code of Case 1 as follows:
Case 3:
From this we can see that HTML5 does bring us great convenience.