宝塔面板UI错乱90%因缓存：需硬重载（Ctrl+F5或Cmd+Shift+R）、清面板缓存（bt 11）并删旧JS/CSS文件、重启面板，再排查CDN/反代缓存（如Cloudflare需Bypass）。
宝塔面板后台UI布局错乱，90%情况不是面板坏了，而是浏览器缓存了旧版CSS或JS文件，尤其是升级后刷新不彻底时。
为什么清缓存后还要强制重载资源
浏览器对 static/css/app.css 和 static/js/app.js 这类静态资源有强缓存策略（Cache-Control: max-age=31536000），即使面板已更新，浏览器仍可能复用一年前的本地副本。单纯按 F5 是“条件性重载”，不会跳过缓存；必须触发“硬重载”。
- Windows/Linux：按住
Ctrl键再点刷新按钮，或用快捷键Ctrl + F5 - macOS：按住
Cmd + Shift + R - Chrome/Firefox 地址栏右侧点击「循环箭头」图标时，长按可唤出硬重载选项
宝塔面板自身缓存也要清
面板前端资源经由 Nginx 的 gzip_static on 和 etag off 等配置优化，但升级后旧版本的 .gz 文件可能残留，导致返回压缩内容与实际 JS 不匹配——表现为按钮错位、菜单空白、Vue组件不渲染。
- 登录服务器，执行：
bt 11（进入“清除缓存”菜单）→ 选“清除所有缓存” - 手动删一次更保险：
rm -f /www/server/panel/static/js/app.js* /www/server/panel/static/css/app.css* - 重启面板：
bt restart，再等 10 秒让资源重建
检查是否被CDN或反向代理干扰
如果你用 Nginx 做了反向代理（比如套了 Cloudflare、又或自建 CDN），Expires 和 Cache-Control 响应头可能被中间层固化，导致无论怎么清浏览器缓存都无效。
- 打开浏览器开发者工具（
F12），切换到 Network 标签页，刷新页面，点一个app.css请求 → 查看 Response Headers 中的cache-control值是不是max-age=31536000 - 如果是，说明代理层在发号施令，需修改反代配置，在 location 块里加：
add_header Cache-Control "no-cache, no-store, must-revalidate"; - Cloudflare 用户：进「Rules」→「Page Rules」，加一条
*/static/*，设置「Cache Level = Bypass」
真正麻烦的不是缓存本身，是它藏在浏览器、面板服务、反向代理三层里，而你只盯着第一层刷 F5。改完任何一层，都要关掉所有标签页再开新窗口验证——因为已打开的页面会维持旧 socket 和缓存上下文，连硬重载都救不回来。
