UD5工具箱
丰富的配置选项
本工具提供五大核心配置维度，让您精确控制 FAQ 手风琴的外观和行为，无需编写一行 CSS 或 JavaScript 代码。
手风琴模式切换
支持两种经典手风琴交互模式。单选模式（单开）：同一时间只允许展开一个问答项，展开新项时自动折叠已展开的项，适合内容量大、希望用户逐条阅读的场景。多选模式（多开）：允许多个问答项同时展开，用户可以自由组合查看多个答案，适合需要对比不同问题答案的场景。通过一个下拉菜单即可完成切换，预览区即时反映变化。
视觉样式选择
默认边框模式：每个问答项之间有清晰的分隔线和边框，视觉层次分明，适合信息密集型页面。无边框（Flush）模式：去除项之间的分隔边框，问答项紧密排列，整体风格更加简洁现代，适合追求极简设计的页面。两种样式均遵循 Bootstrap 5.3 的设计规范，确保与现有 Bootstrap 组件的视觉协调性。
图标风格定制
Chevron 箭头图标：使用 Bootstrap 内置的 chevron-down 箭头，风格简洁专业，是 Bootstrap 手风琴的默认图标方案。Plus/Minus 加减号图标：使用加号表示折叠状态、减号表示展开状态，语义更加直观明确，用户无需思考即可理解交互含义。切换图标风格时，生成的代码会自动包含对应的内联 CSS 样式，无需额外引入图标库。
展开行为控制
首项默认展开：页面加载时自动展开第一个问答项，引导用户从第一个问题开始阅读，适合内容有逻辑顺序的场景。始终展开一项：确保手风琴在任何时刻至少有一个问答项处于展开状态，防止出现所有项都折叠的空旷感，维持页面的内容存在感和视觉饱满度。两个选项可独立开关，也可组合使用。
FAQ 条目管理
支持动态添加和删除 FAQ 条目，每个条目包含问题和答案两个输入字段。输入框采用多行文本设计，答案区域支持较长的文本内容。条目列表实时显示当前已添加的条目数量，支持拖拽排序（如有）。删除按钮位于每个条目旁，操作直观便捷。所有编辑操作即时反映在右侧预览区，实现真正的所见即所得。
快速模板系统
内置三套预设 FAQ 模板，一键填充示例内容，帮助您快速了解手风琴组件的实际效果。产品 FAQ 模板：包含产品功能、价格、兼容性等典型电商问答。服务 FAQ 模板：涵盖服务流程、售后保障、退款政策等服务类问题。技术 FAQ 模板：包含 API 接入、常见错误、技术支持等技术类问答。模板内容可完全自定义修改。
代码生成与导出
实时预览区右侧展示生成的完整 HTML 代码，代码行数实时统计。点击复制按钮一键将代码复制到剪贴板，可直接粘贴到任何 HTML 页面或 CMS 的自定义 HTML 区块中。代码结构清晰，包含必要的 HTML 结构、内联 CSS 样式和 JavaScript 逻辑（如选择了 Plus/Minus 图标或始终展开一项功能）。支持展开全部和折叠全部快捷按钮，方便在预览区快速检查所有内容。重置按钮一键清空所有配置和条目，从零开始创建。