应使用 position: fixed 而非 absolute，因 fixed 始终相对于视口定位、滚动不偏移，而 absolute 依赖最近已定位祖先，易受父容器 transform 或滚动影响导致错位；bottom/right 推荐起始值为 20px，需配合媒体查询适配移动端及底部元素间隙；z-index 需高于同级浮层（如 modal 的 1050），但避免滥用超大数值；交互上须确保焦点管理、Esc 关闭、遮罩点击及表单校验完整。
为什么用 position: fixed 而不是 position: absolute
因为 absolute 会相对于最近的已定位祖先元素（比如 position: relative 的父容器）偏移，页面一滚动，按钮就跟着“消失”；而 fixed 是相对于视口（viewport）定位，滚动时始终钉在屏幕右下角。常见错误是误用 absolute 后发现按钮随内容滚动跑偏，或者被遮挡——根本没固定住。
bottom 和 right 值设多少才合理
推荐从 bottom: 20px、right: 20px 起手，这是兼顾可触达性与不遮挡内容的常用安全距离。注意：
• 移动端小屏下若按钮太靠近边缘，可能被手指误触或系统手势栏遮挡，建议用 @media 调整为 bottom: 16px、right: 16px；
• 若页面底部有固定 footer 或 tabbar，需预留足够间隙，避免重叠；
• 不要设 top 或 left，否则按钮会卡在左上角，反而干扰阅读。
z-index 必须 ≥1000 吗
不一定非得是 1000，但必须高于页面中其他 fixed 或 absolute 元素。实际项目里常见冲突点：
• Bootstrap 的 modal 默认 z-index: 1050，反馈按钮至少设 1060 才能浮在上面；
• 广告 banner、导航栏、加载遮罩层也常设 z-index: 999 或更高；
• 检查方式：打开 DevTools → 选中按钮 → 查看 computed styles 中的 z-index 是否生效，以及是否被其他层覆盖；
• 避免用超大值如 999999，容易引发后续维护混乱。
点击后弹出浮窗，怎么保证焦点和键盘操作可用
单纯加个 onclick 弹窗不够，用户用键盘 Tab 导航时容易“掉进”浮窗外的空白区域，或按 Escape 无法关闭。必须：
• 用 classList.toggle('feedback-modal--open') 控制显隐，配合 CSS 的 opacity 和 visibility 过渡；
• 浮窗显示时，用 document.querySelector('.feedback-modal').focus() 主动聚焦首个可交互元素（如输入框）；
• 监听 Escape 键：document.addEventListener('keydown', e => e.key === 'Escape' && closeFeedbackModal())；
• 点击遮罩层（非表单区域）也要关闭，且禁止事件冒泡到背景内容；
• 表单提交前务必 e.preventDefault()，校验必填字段，提交中禁用按钮，成功后清空并重置状态。
立即学习“前端免费学习笔记（深入）”；
实际最容易被忽略的，是滚动时按钮是否仍可点击、是否被 iOS Safari 底部地址栏或 Android 虚拟导航键遮挡——这需要真机测试，不能只靠 Chrome DevTools 的模拟器。
