纯 HTML 实现手风琴用 和 标签，语义清晰、无需 JS、支持键盘操作与屏幕阅读器；加 open 属性可默认展开，多组并列实现多面板，CSS 仅用于样式微调。
html 写法">
纯 HTML 实现手风琴（Accordion）或折叠面板，核心是利用
基本结构：一个可折叠项
每个
常见问题 1
这里是展开后显示的内容，可以是文字、列表、甚至图片。
默认展开与多个面板
加 open 属性让某一项默认展开；多个
默认打开的面板
初始状态即可见。点击才展开的面板
初始隐藏。
样式微调（可选，仍属纯 HTML + 内联或外部 CSS）
原生
立即学习“前端免费学习笔记（深入）”；
details summary {
list-style: none;
}
details summary::marker {
content: "▶ ";
}
details[open] summary::marker {
content: "▼ ";
}
注意：该 CSS 不影响 HTML 结构合法性，仍属于“纯 HTML 方案”的延伸优化。
无障碍与兼容性提示
优势：自带 ARIA role（role="group" 和 role="button"），屏幕阅读器友好；支持 Safari、Chrome、Firefox、Edge（现代版本均支持）。
注意：IE 完全不支持，如需兼容 IE，必须降级为 JS 方案——但严格意义上已不属于“纯 HTML”范畴。
