136 lines
6.1 KiB
HTML
136 lines
6.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<base href="https://yt.pengyuthon.cn/">
|
|
<title>种族 — 宇森</title>
|
|
<style>
|
|
* { margin:0; padding:0; box-sizing:border-box; }
|
|
body {
|
|
font-family:'Microsoft YaHei', 'PingFang SC', sans-serif;
|
|
background:#06090f; color:#c8d6e5; line-height:1.7;
|
|
}
|
|
#particles { position:fixed; top:0; left:0; width:100%; height:100%; z-index:0; pointer-events:none; }
|
|
nav {
|
|
position:fixed; top:0; left:0; right:0; z-index:1000;
|
|
background:rgba(6,9,15,0.85); backdrop-filter:blur(12px);
|
|
border-bottom:1px solid rgba(100,200,255,0.1);
|
|
padding:0 40px; height:56px; display:flex; align-items:center; justify-content:space-between;
|
|
}
|
|
nav .logo { font-size:18px; font-weight:bold; text-decoration:none; letter-spacing:2px; background:linear-gradient(135deg,#4af,#a8e6cf); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
|
|
nav .links { display:flex; gap:28px; list-style:none; }
|
|
nav .links a { color:#667788; text-decoration:none; font-size:14px; transition:color 0.3s; }
|
|
nav .links a:hover, nav .links a.active { color:#4af; }
|
|
|
|
.page { position:relative; z-index:1; padding:90px 32px 60px; max-width:860px; margin:0 auto; }
|
|
h1 { font-size:32px; font-weight:bold; margin-bottom:8px; background:linear-gradient(135deg,#4af,#a8e6cf); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
|
|
.page-sub { color:#556677; font-size:15px; margin-bottom:40px; }
|
|
|
|
.races { display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:18px; }
|
|
.race-card {
|
|
background:rgba(10,20,40,0.5); border:1px solid rgba(100,200,255,0.12);
|
|
border-radius:14px; padding:26px 22px; text-align:center;
|
|
transition:transform 0.3s, border-color 0.3s;
|
|
}
|
|
.race-card:hover { transform:translateY(-4px); border-color:rgba(100,200,255,0.3); }
|
|
.race-icon { font-size:42px; margin-bottom:10px; }
|
|
.race-card h3 { font-size:17px; color:#e8e8e8; margin-bottom:6px; }
|
|
.race-trait { font-size:12px; color:#a8e6cf; margin-bottom:10px; letter-spacing:1px; }
|
|
.race-detail { font-size:13px; color:#8899aa; line-height:1.65; }
|
|
|
|
.note-box {
|
|
background:rgba(10,25,50,0.45); border:1px solid rgba(100,200,255,0.1);
|
|
border-radius:12px; padding:22px 26px; margin-top:36px; text-align:center;
|
|
}
|
|
.note-box p { font-size:13.5px; color:#778899; margin:0; line-height:1.7; }
|
|
|
|
@media (max-width:768px) {
|
|
h1 { font-size:24px; } nav .links { display:none; } .page { padding:80px 20px 40px; }
|
|
.races { grid-template-columns:1fr; } .race-card { padding:22px 18px; }
|
|
}
|
|
</style>
|
|
<link rel="stylesheet" href="auth.css">
|
|
</head>
|
|
<body>
|
|
|
|
<canvas id="particles"></canvas>
|
|
|
|
<nav>
|
|
<a href="index.html" class="logo">宇森</a>
|
|
<div id="auth-area"></div>
|
|
<ul class="links">
|
|
<li><a href="intro.html">游戏介绍</a></li>
|
|
<li><a href="platform.html">平台架构</a></li>
|
|
<li><a href="world.html">世界结构</a></li>
|
|
<li><a href="races.html" class="active">种族</a></li>
|
|
<li><a href="demo.html">演示</a></li>
|
|
</ul>
|
|
</nav>
|
|
|
|
<div class="page">
|
|
<h1>七大种族</h1>
|
|
<p class="page-sub">创建文明时选择种族，不可更改，决定 NPC 性格分布和文明初始偏向</p>
|
|
|
|
<div class="races">
|
|
<div class="race-card">
|
|
<div class="race-icon">👤</div>
|
|
<h3>人类</h3>
|
|
<div class="race-trait">均衡型</div>
|
|
<div class="race-detail">全属性 +5%。没有短板，也没有极端优势。最适合新手的种族。</div>
|
|
</div>
|
|
<div class="race-card">
|
|
<div class="race-icon">🧝</div>
|
|
<h3>森精灵</h3>
|
|
<div class="race-trait">高智慧 · 低生育</div>
|
|
<div class="race-detail">研究 +20%，森林建造双倍。人口增长 -15%，战斗力 -10%。</div>
|
|
</div>
|
|
<div class="race-card">
|
|
<div class="race-icon">⛏️</div>
|
|
<h3>山矮人</h3>
|
|
<div class="race-trait">高生产力 · 低移动</div>
|
|
<div class="race-detail">建造 +25%，矿脉产出 +30%。移动范围 -2 格，粮食消耗 +10%。</div>
|
|
</div>
|
|
<div class="race-card">
|
|
<div class="race-icon">🐉</div>
|
|
<h3>龙裔</h3>
|
|
<div class="race-trait">高战斗 · 低社交</div>
|
|
<div class="race-detail">战斗力 +30%，火焰耐性。交易收益 -15%，外交好感 -10%。</div>
|
|
</div>
|
|
<div class="race-card">
|
|
<div class="race-icon">❄️</div>
|
|
<h3>冰灵族</h3>
|
|
<div class="race-trait">高魔法 · 低体力</div>
|
|
<div class="race-detail">信仰产出 +25%，雪地生存。沙漠/火山不可进入，人口上限 -10%。</div>
|
|
</div>
|
|
<div class="race-card">
|
|
<div class="race-icon">🦍</div>
|
|
<h3>兽人</h3>
|
|
<div class="race-trait">高体力 · 低智慧</div>
|
|
<div class="race-detail">人口增长 +20%，夜战加成。研究速度 -20%，建筑上限 -2。</div>
|
|
</div>
|
|
<div class="race-card">
|
|
<div class="race-icon">🌑</div>
|
|
<h3>暗影族</h3>
|
|
<div class="race-trait">高隐秘 · 低道德</div>
|
|
<div class="race-detail">侦查 +30%，偷窃成功率 +25%。外交永久 -1 级，神庙无效。</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="note-box">
|
|
<p>每个种族的数值都是<strong style="color:#4af;">初始偏向</strong>，不是永久锁死。<br>通过游戏进程中的事件、建筑和神器，任何种族都可以发展出独特的能力路径。</p>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
const c=document.getElementById('particles'),x=c.getContext('2d');let P=[];
|
|
function R(){c.width=innerWidth;c.height=innerHeight}R();addEventListener('resize',R);
|
|
class Particle{constructor(){this.r();this.y=Math.random()*c.height}r(){this.x=Math.random()*c.width;this.y=-10;this.s=Math.random()*1.5+0.5;this.v=Math.random()*0.3+0.1;this.o=Math.random()*0.5+0.1}u(){this.y+=this.v;if(this.y>c.height+10)this.r()}d(){x.fillStyle=`rgba(100,200,255,${this.o})`;x.beginPath();x.arc(this.x,this.y,this.s,0,Math.PI*2);x.fill()}}
|
|
for(let i=0;i<80;i++)P.push(new Particle());
|
|
(function A(){x.clearRect(0,0,c.width,c.height);P.forEach(p=>{p.u();p.d()});requestAnimationFrame(A)})();
|
|
</script>
|
|
<script src="auth.js"></script>
|
|
<script>YuSenAuth.init();</script>
|
|
</body>
|
|
</html>
|