2026-01-08 19:16:23 +08:00
|
|
|
|
# 三国杀网页游戏
|
|
|
|
|
|
|
|
|
|
|
|
一款基于经典三国杀卡牌规则的5人在线对战网页游戏，专为喜欢策略卡牌游戏的玩家设计。
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
## 🎮 游戏简介
|
|
|
|
|
|
|
|
|
|
|
|
三国杀网页游戏是一款完全基于浏览器运行的策略卡牌游戏，支持5人身份对战模式。游戏采用经典的身份系统、角色技能系统和卡牌战斗系统，为玩家提供紧张刺激的对战体验。
|
|
|
|
|
|
|
|
|
|
|
|
## ✨ 核心功能
|
|
|
|
|
|
|
|
|
|
|
|
### 1. 身份系统
|
|
|
|
|
|
- **5人身份模式**：1个主公、1个忠臣、2个反贼、1个内奸
|
|
|
|
|
|
- **身份隐藏**：主公身份公开，其他身份在游戏开始时隐藏
|
|
|
|
|
|
- **胜利条件**：
|
|
|
|
|
|
- 主公：消灭所有反贼和内奸
|
|
|
|
|
|
- 忠臣：保护主公，协助主公消灭反贼和内奸
|
|
|
|
|
|
- 反贼：消灭主公
|
|
|
|
|
|
- 内奸：消灭除自己外的所有角色，最后与主公单挑并获胜
|
|
|
|
|
|
|
|
|
|
|
|
### 2. 角色与技能系统
|
|
|
|
|
|
- **10+经典角色**：刘备、曹操、孙权、诸葛亮、关羽、张飞、赵云、黄月英、吕布、貂蝉等
|
|
|
|
|
|
- **独特技能**：每个角色拥有专属的主动和被动技能
|
|
|
|
|
|
- 刘备：仁德（可以将手牌分给其他玩家）
|
|
|
|
|
|
- 曹操：奸雄（受到伤害后可以获得造成伤害的牌）
|
|
|
|
|
|
- 孙权：制衡（可以弃牌重新摸牌）
|
|
|
|
|
|
- 诸葛亮：空城（没有手牌时不能成为杀的目标）
|
|
|
|
|
|
- 关羽：武圣（可以将红色牌当作杀使用）
|
|
|
|
|
|
- 张飞：咆哮（可以无限出杀）
|
|
|
|
|
|
- 赵云：龙胆（可以将杀当闪，闪当杀）
|
|
|
|
|
|
- 黄月英：集智（使用锦囊牌后可以摸一张牌）
|
|
|
|
|
|
- 吕布：无双（使用杀时需要两张闪才能闪避）
|
|
|
|
|
|
- 貂蝉：离间（可以指定两名男性角色决斗）
|
|
|
|
|
|
- **角色属性**：不同角色有不同的血量、攻击范围等属性
|
|
|
|
|
|
|
|
|
|
|
|
### 3. 卡牌与战斗系统
|
|
|
|
|
|
- **基础牌**：
|
|
|
|
|
|
- 杀：对目标造成1点伤害
|
|
|
|
|
|
- 闪：抵挡杀的效果
|
|
|
|
|
|
- 桃：回复1点血量或救活濒死角色
|
|
|
|
|
|
- **装备牌**：
|
|
|
|
|
|
- 武器：增加攻击距离（诸葛连弩、青龙偃月刀等）
|
|
|
|
|
|
- 防具：提供防御效果（八卦阵、藤甲等）
|
|
|
|
|
|
- 进攻马：减少攻击距离
|
|
|
|
|
|
- 防御马：增加被攻击距离
|
|
|
|
|
|
- **锦囊牌**：
|
|
|
|
|
|
- 无中生有：摸2张牌
|
|
|
|
|
|
- 过河拆桥：弃掉目标一张牌
|
|
|
|
|
|
- 顺手牵羊：获得目标一张牌
|
|
|
|
|
|
- 南蛮入侵：所有其他角色需要出杀，否则受到1点伤害
|
|
|
|
|
|
- 万箭齐发：所有其他角色需要出闪，否则受到1点伤害
|
|
|
|
|
|
- 闪电：随机判定，受到3点雷属性伤害
|
|
|
|
|
|
- 乐不思蜀：目标下回合跳过出牌阶段
|
|
|
|
|
|
- 兵粮寸断：目标下回合跳过摸牌阶段
|
|
|
|
|
|
- 铁索连环：连接多个角色，伤害会传导
|
|
|
|
|
|
- 火攻：展示目标一张牌，如果是红色则受到1点火属性伤害
|
|
|
|
|
|
- 火杀：造成火属性伤害
|
|
|
|
|
|
- 雷杀：造成雷属性伤害
|
|
|
|
|
|
- **攻击距离系统**：根据武器和马匹计算攻击范围
|
|
|
|
|
|
- **回合制战斗**：摸牌阶段、出牌阶段、弃牌阶段、结束阶段
|
|
|
|
|
|
|
|
|
|
|
|
## 🎯 如何开始游戏
|
|
|
|
|
|
|
|
|
|
|
|
### 方式一：直接打开
|
|
|
|
|
|
1. 下载或克隆本仓库
|
|
|
|
|
|
2. 用浏览器打开 `index.html` 文件
|
|
|
|
|
|
3. 点击"开始游戏"按钮即可开始
|
|
|
|
|
|
|
|
|
|
|
|
### 方式二：本地服务器
|
|
|
|
|
|
```bash
|
|
|
|
|
|
# 使用 Python 启动本地服务器
|
|
|
|
|
|
python -m http.server 8000
|
|
|
|
|
|
|
|
|
|
|
|
# 使用 Node.js 启动本地服务器
|
|
|
|
|
|
npx http-server -p 8000
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
然后在浏览器中访问 `http://localhost:8000`
|
|
|
|
|
|
|
|
|
|
|
|
## 🎲 游戏流程
|
|
|
|
|
|
|
|
|
|
|
|
### 游戏开始
|
|
|
|
|
|
1. 打开网页，点击"开始游戏"按钮
|
|
|
|
|
|
2. 系统随机分配身份和角色
|
|
|
|
|
|
3. 显示游戏界面，用户在中间位置，其他4个AI玩家环绕
|
|
|
|
|
|
4. 查看自己的身份、角色、血量和手牌
|
|
|
|
|
|
|
|
|
|
|
|
### 游戏进行
|
|
|
|
|
|
1. **摸牌阶段**：点击"摸牌"按钮，从牌堆抽取2张牌
|
|
|
|
|
|
2. **出牌阶段**：
|
|
|
|
|
|
- 点击手牌选择要使用的牌
|
|
|
|
|
|
- 如果需要目标，点击目标玩家
|
|
|
|
|
|
- 点击"出牌"按钮使用牌
|
|
|
|
|
|
- 点击"技能"按钮使用角色技能
|
|
|
|
|
|
3. **结束回合**：点击"结束回合"按钮，轮到下一个玩家
|
|
|
|
|
|
|
|
|
|
|
|
### 游戏结束
|
|
|
|
|
|
- 当某一方达成胜利条件时，显示胜利/失败提示
|
|
|
|
|
|
- 查看游戏统计信息
|
|
|
|
|
|
- 点击"再来一局"按钮重新开始
|
|
|
|
|
|
|
|
|
|
|
|
## 🛠️ 技术栈
|
|
|
|
|
|
|
|
|
|
|
|
- **前端框架**：纯原生 JavaScript
|
|
|
|
|
|
- **样式**：CSS3
|
|
|
|
|
|
- **标记语言**：HTML5
|
|
|
|
|
|
- **动画效果**：CSS Animations
|
|
|
|
|
|
- **AI系统**：基于优先级的智能决策算法
|
|
|
|
|
|
|
|
|
|
|
|
## 🎨 游戏特色
|
|
|
|
|
|
|
|
|
|
|
|
- **纯前端实现**：无需后端服务器，完全在浏览器中运行
|
|
|
|
|
|
- **响应式设计**：支持不同屏幕尺寸，适配桌面和移动设备
|
|
|
|
|
|
- **精美动画**：卡牌使用、攻击、伤害等都有流畅的动画效果
|
|
|
|
|
|
- **智能AI**：4个AI玩家具有不同的策略和决策能力
|
|
|
|
|
|
- **完整规则**：实现了标准三国杀的核心规则和技能
|
|
|
|
|
|
|
|
|
|
|
|
## 📋 游戏规则
|
|
|
|
|
|
|
|
|
|
|
|
### 基本规则
|
|
|
|
|
|
- 每个玩家初始有4张手牌
|
|
|
|
|
|
- 每回合可以出一张杀（除非有特殊技能或装备）
|
|
|
|
|
|
- 血量归零时进入濒死状态，可以使用桃救活
|
|
|
|
|
|
- 主公身份在游戏开始时公开，其他身份隐藏
|
|
|
|
|
|
|
|
|
|
|
|
### 胜利条件
|
|
|
|
|
|
- **主公胜利**：消灭所有反贼和内奸
|
|
|
|
|
|
- **忠臣胜利**：主公胜利则忠臣胜利
|
|
|
|
|
|
- **反贼胜利**：消灭主公
|
|
|
|
|
|
- **内奸胜利**：消灭除自己外的所有角色，最后与主公单挑并获胜
|
|
|
|
|
|
|
|
|
|
|
|
## 🤝 贡献指南
|
|
|
|
|
|
|
|
|
|
|
|
欢迎提交 Issue 和 Pull Request！
|
|
|
|
|
|
|
|
|
|
|
|
1. Fork 本仓库
|
|
|
|
|
|
2. 创建特性分支 (`git checkout -b feature/AmazingFeature`)
|
|
|
|
|
|
3. 提交更改 (`git commit -m 'Add some AmazingFeature'`)
|
|
|
|
|
|
4. 推送到分支 (`git push origin feature/AmazingFeature`)
|
|
|
|
|
|
5. 开启 Pull Request
|
|
|
|
|
|
|
|
|
|
|
|
## 📝 更新日志
|
|
|
|
|
|
|
|
|
|
|
|
### v1.0.0 (2024-01-08)
|
|
|
|
|
|
- 初始版本发布
|
|
|
|
|
|
- 实现5人身份系统
|
|
|
|
|
|
- 实现10+角色和技能系统
|
|
|
|
|
|
- 实现完整的卡牌系统
|
|
|
|
|
|
- 实现AI智能决策
|
|
|
|
|
|
- 实现卡牌动画效果
|
|
|
|
|
|
|
|
|
|
|
|
## 📄 许可证
|
|
|
|
|
|
|
|
|
|
|
|
本项目采用 MIT 许可证 - 详见 LICENSE 文件
|
|
|
|
|
|
|
|
|
|
|
|
## 🙏 致谢
|
|
|
|
|
|
|
|
|
|
|
|
- 感谢经典三国杀游戏提供的灵感
|
|
|
|
|
|
- 感谢所有贡献者的支持
|
|
|
|
|
|
|
|
|
|
|
|
## 📮 联系方式
|
|
|
|
|
|
|
|
|
|
|
|
- 作者：zhangjian
|
|
|
|
|
|
- 邮箱：st2411020104@gitea.local
|
|
|
|
|
|
- 项目地址：http://hblu.top:3000/Python2025-CourseDesign/zhangjian.git
|
2026-01-08 19:27:11 +08:00
|
|
|
|
### 团队成员与贡献
|
|
|
|
|
|
姓名 学号 主要贡献 (具体分工)
|
|
|
|
|
|
程俊 2411020113 (组长) 核心逻辑开发、Prompt 编写
|
|
|
|
|
|
张健 2411020104 前端界面设计
|
|
|
|
|
|
孙赫 2411020105 文档撰写、测试与 Bug 修复
|
|
|
|
|
|
|
|
|
|
|
|
### 感想
|
|
|
|
|
|
我们三个人借助TraeCN开发三国杀网页版的经历，是一次理论落地与协作成长的双重收获。作为编程实践项目，我们从拆分需求起步：一人负责基于TraeCN搭建网页框架、实现卡牌拖拽等交互效果；一人梳理游戏核心规则，将武将技能、卡牌结算逻辑转化为可执行代码；另一人专注于多人联机同步与bug调试，分工明确让开发少走了很多弯路。开发中，TraeCN的轻量化特性帮我们省去了复杂的环境配置，代码同步和功能测试都高效不少，但难点也接踵而至。比如武将技能的触发条件嵌套、多人回合制的时序同步，都需要反复推敲逻辑。我们曾因“过河拆桥”能否对特定武将生效争执不下，最终通过查规则、写测试用例逐一验证；网页端卡牌动画卡顿的问题，也是借助TraeCN的调试工具反复优化代码才得以解决。这段经历让我们深刻体会到，小团队开发的核心不仅是技术，更是沟通与互补。有人擅长前端界面打磨，有人精通逻辑编写，彼此查漏补缺，才能高效攻克难题。当测试版本成功运行，三人在线上完成第一局对战时，那种成就感远超代码实现本身。此次开发不仅让我们掌握了TraeCN的使用技巧，更明白了从想法到产品的距离，需要耐心、协作与反复打磨。未来我们还可能用TraeCN添加更多武将和玩法模式，让这个小小的网页版三国杀更具趣味性
|
2026-01-08 19:16:23 +08:00
|
|
|
|
---
|
|
|
|
|
|
|
|
|
|
|
|
**享受游戏，祝您好运！** 🎴⚔️
|
