要创建可折叠的内容,您可以使用HTML5的details和summary元素。下面是一个简单的示例:
<details>
<summary>点击这里展开/收起内容</summary>
<p>这里是要展开/收起的内容</p>
</details>
在上面的示例中,details
元素用于包含可折叠的内容,而summary
元素用于显示展开/收起的文本。展开/收起的内容可以放在details
元素内部的任何元素中,例如段落、列表等。
当用户单击summary
元素时,details
元素将展开或收起,显示或隐藏其内部内容。
请注意,details
和summary
元素不是所有浏览器都支持的,因此在使用时请测试浏览器兼容性。