王者战区查询网页版
📖 项目简介
战区查询是一个专注于王者荣耀游戏数据查询和分析的专业平台。我们致力于为玩家提供最准确、最全面的游戏信息，帮助您更好地了解游戏，提升游戏体验。
✨ 主要功能
🎮 英雄查询
快速查询：秒级响应，快速获取英雄信息和战力数据
数据分析：深度分析英雄数据，提供专业的战力评估
移动适配：完美适配各种设备，随时随地查询数据
同步更新：数据每天同步，确保信息的准确性和时效性
🔍 战区数据查询
支持安卓QQ、安卓微信、苹果QQ、苹果微信四个大区
提供最低战区查询功能
显示金牌、银牌、铜牌三个档次的战区信息
支持一键复制战区名称
🛠️ 后台管理
完整的后台登录系统
数据统计和管理功能
响应式管理界面
🚀 技术特点
前端技术
HTML5 + CSS3 + JavaScript ES6+
响应式设计：完美适配桌面、平板、手机
现代化UI：渐变背景、卡片式布局、动画效果
PWA支持：渐进式Web应用，支持离线访问
设计特色
品牌色彩：使用统一的青色主题 (#299f92)
图标系统：完整的favicon和PWA图标支持
用户体验：平滑动画、悬停效果、一键回到顶部
无障碍设计：良好的可访问性和用户体验
📁 项目结构
战区查询/
├── index.html # 主页面
├── admin.html # 后台管理页面
├── site.webmanifest # PWA清单文件
├── generate-icons.html # 图标生成工具
├── favicon.svg # SVG图标源文件
├── styles/
│ └── main.css # 主样式文件
├── js/
│ └── app.js # 主JavaScript文件
└── images/
├── favicon.ico # 网站图标
├── favicon-16x16.png # 16x16图标
├── favicon-32x32.png # 32x32图标
└── apple-touch-icon.png # iOS图标
🎯 核心功能
英雄列表展示
支持按类型筛选（战士、法师、坦克、刺客、射手、辅助）
实时搜索功能
英雄头像和角色标签显示
响应式网格布局
战区数据查询
多平台支持（安卓/苹果 + QQ/微信）
实时API调用
优雅的过渡动画
查询结果展示
用户体验优化
弹窗滚动控制
一键回到顶部
全局导航功能
加载状态提示
🎨 设计系统
色彩方案
主色调：#299f92 (青色)
辅助色：#667eea (蓝色)
强调色：#ffd700 (金色)
背景色：#f5f5f5 (浅灰)
图标设计
皇冠主题，象征王者荣耀
圆形背景，现代简洁
多尺寸支持，适配各种设备
品牌一致性
📱 响应式设计
桌面端
一行显示10个英雄
完整的导航和功能展示
优化的交互体验
平板端
一行显示5个英雄
适配中等屏幕尺寸
保持核心功能
手机端
一行显示5个英雄
紧凑的布局设计
触摸友好的交互
🔧 部署说明
本地开发
克隆项目到本地
使用本地服务器运行（如 Live Server）
访问
http://localhost:端口号
服务器部署
上传所有文件到服务器
支持二级目录部署
确保所有静态资源路径正确
图标部署
使用
generate-icons.html生成图标将图标文件放入
images/文件夹图标将自动在浏览器中显示
📊 后台管理
访问地址
后台地址：
/admin.html支持多账号登录
数据统计和管理功能
假账号系统
预设3个测试账号
其他账号显示"密码错误"
完整的登录状态管理
🌟 特色亮点
用户体验
快速响应：优化的加载速度和交互反馈
视觉美观：现代化的设计风格和动画效果
功能完整：从查询到管理的完整功能链
移动优先：响应式设计，完美适配各种设备
技术实现
模块化设计：清晰的代码结构和功能分离
性能优化：图片懒加载、动画优化、内存管理
兼容性：支持主流浏览器和移动设备
可维护性：规范的代码风格和注释
