180 lines
12 KiB
HTML
180 lines
12 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>暗影初现 - 阿拉德：剑之回响</title>
|
||
<link href="https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;600;700&family=Noto+Sans+SC:wght@300;400;500;700&display=swap" rel="stylesheet">
|
||
<style>
|
||
:root { --bg-primary: linear-gradient(135deg, #0f0c29 0%, #302b63 50%, #24243e 100%); --text-primary: #e0e0e0; --text-secondary: #888; --accent-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%); --border-color: rgba(255,255,255,0.1); --btn-bg: rgba(255,255,255,0.1); --btn-hover: rgba(255,255,255,0.2); }
|
||
[data-theme="light"] { --bg-primary: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%); --text-primary: #333; --text-secondary: #666; --border-color: rgba(0,0,0,0.1); --btn-bg: rgba(0,0,0,0.05); --btn-hover: rgba(0,0,0,0.1); }
|
||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||
body { font-family: 'Noto Serif SC', serif; background: var(--bg-primary); color: var(--text-primary); line-height: 1.8; min-height: 100vh; }
|
||
.container { max-width: 800px; margin: 0 auto; padding: 20px; padding-bottom: 120px; }
|
||
.top-nav { position: fixed; top: 0; left: 0; right: 0; background: rgba(0,0,0,0.3); backdrop-filter: blur(10px); border-bottom: 1px solid var(--border-color); z-index: 1000; padding: 10px 20px; }
|
||
.top-nav-content { max-width: 800px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; }
|
||
.nav-link { color: var(--text-primary); text-decoration: none; font-family: 'Noto Sans SC', sans-serif; font-size: 14px; padding: 8px 16px; background: var(--btn-bg); border: 1px solid var(--border-color); border-radius: 8px; }
|
||
.nav-link:hover { background: var(--btn-hover); }
|
||
.chapter-header { text-align: center; padding: 80px 0 40px; border-bottom: 1px solid var(--border-color); margin-bottom: 40px; }
|
||
.chapter-number { font-size: 14px; color: var(--text-secondary); letter-spacing: 4px; margin-bottom: 10px; }
|
||
.chapter-title { font-size: 32px; font-weight: 700; background: var(--accent-gradient); -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin-bottom: 20px; }
|
||
.chapter-content { font-size: 18px; line-height: 2; text-align: justify; }
|
||
.chapter-content p { margin-bottom: 1.5em; text-indent: 2em; }
|
||
.chapter-content p:first-of-type::first-letter { font-size: 3em; float: left; line-height: 1; margin-right: 8px; margin-top: -5px; background: var(--accent-gradient); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-weight: 700; }
|
||
.fixed-nav { position: fixed; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.3); backdrop-filter: blur(10px); border-top: 1px solid var(--border-color); z-index: 1000; padding: 15px 20px; }
|
||
.fixed-nav-content { max-width: 800px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; }
|
||
.nav-btn { padding: 12px 24px; background: var(--btn-bg); border: 1px solid var(--border-color); border-radius: 8px; color: var(--text-primary); text-decoration: none; font-family: 'Noto Sans SC', sans-serif; font-size: 14px; cursor: pointer; }
|
||
.nav-btn:hover { background: var(--btn-hover); }
|
||
.scroll-buttons { position: fixed; right: 20px; bottom: 90px; display: flex; flex-direction: column; gap: 10px; z-index: 1001; }
|
||
.scroll-btn { width: 40px; height: 40px; border-radius: 8px; background: var(--btn-bg); border: 1px solid var(--border-color); color: var(--text-primary); cursor: pointer; display: flex; align-items: center; justify-content: center; }
|
||
.sidebar { position: fixed; right: 20px; top: 50%; transform: translateY(-50%); background: rgba(0,0,0,0.5); backdrop-filter: blur(10px); border-radius: 12px; border: 1px solid var(--border-color); width: 200px; max-height: 70vh; z-index: 999; display: flex; flex-direction: column; }
|
||
.sidebar-title { font-size: 14px; color: var(--text-secondary); padding: 15px 20px; border-bottom: 1px solid var(--border-color); }
|
||
.sidebar-content { overflow-y: auto; padding: 10px 20px 20px; flex: 1; }
|
||
.sidebar-chapter { display: block; padding: 8px 0; color: #aaa; text-decoration: none; font-size: 13px; border-bottom: 1px solid rgba(255,255,255,0.05); }
|
||
.sidebar-chapter:hover { color: #667eea; }
|
||
.sidebar-chapter.current { color: #667eea; font-weight: 600; }
|
||
@media (max-width: 1200px) { .sidebar { display: none; } }
|
||
@media (max-width: 600px) { .chapter-title { font-size: 24px; } .chapter-content { font-size: 16px; } .scroll-buttons { display: none; } }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<nav class="top-nav">
|
||
<div class="top-nav-content">
|
||
<a href="../index.html" class="nav-link">返回首页</a>
|
||
<button class="nav-link" id="themeToggle">切换主题</button>
|
||
</div>
|
||
</nav>
|
||
<div class="container">
|
||
<header class="chapter-header">
|
||
<div class="chapter-number">Chapter 183</div>
|
||
<h1 class="chapter-title">暗影初现</h1>
|
||
</header>
|
||
<article class="chapter-content">
|
||
<p>第二天清晨。</p>
|
||
<p>林克与艾琳娜站在云端之城的传送阵前。</p>
|
||
<p>他们即将前往晨曦浮岛，寻找第一块神之钥碎片。</p>
|
||
<p>卡赞也来了，他将在神界后方支援林克。</p>
|
||
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
|
||
<p>"林克，小心。"卡赞说。</p>
|
||
<p>"暗影的力量不可小觑。"</p>
|
||
<p>"如果遇到危险，立刻撤退。"</p>
|
||
<p>林克点头："我会的。"</p>
|
||
<p>他踏入传送阵，艾琳娜跟随其后。</p>
|
||
<p>光芒闪过，两人消失在传送阵中。</p>
|
||
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
|
||
<p>晨曦浮岛。</p>
|
||
<p>林克睁开眼睛，被眼前的景象震撼。</p>
|
||
<p>整个浮岛笼罩在金色的光芒中。</p>
|
||
<p>光芒从浮岛中央的神殿散发，照亮了整个浮岛。</p>
|
||
<p>但林克注意到，光芒比他想象的要暗淡。</p>
|
||
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
|
||
<p>"光明之源的力量在衰减。"艾琳娜担忧地说。</p>
|
||
<p>"我们得快点。"</p>
|
||
<p>两人向浮岛中央的神殿走去。</p>
|
||
<p>沿途，他们看到了晨曦浮岛的居民。</p>
|
||
<p>神族们面色苍白，显然受到光明衰减的影响。</p>
|
||
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
|
||
<p>"你们是谁？"一个神族守卫拦住了他们。</p>
|
||
<p>艾琳娜回答："我是艾琳娜，神界守护者。"</p>
|
||
<p>"这位是林克，议会邀请的客人。"</p>
|
||
<p>"我们来找神之钥碎片。"</p>
|
||
<p>守卫神色一变："神之钥...在神殿深处。"</p>
|
||
<p>"但最近...神殿出现了奇怪的东西。"</p>
|
||
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
|
||
<p>"奇怪的东西？"林克问。</p>
|
||
<p>守卫点头："是的。"</p>
|
||
<p>"黑色的雾气...从神殿深处涌出。"</p>
|
||
<p>"很多守卫进去后...就没有出来。"</p>
|
||
<p>林克眼神一凝："暗影侵蚀。"</p>
|
||
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
|
||
<p>他大步走向神殿。</p>
|
||
<p>艾琳娜紧随其后，神族守卫们为两人让开道路。</p>
|
||
<p>神殿的大门缓缓打开，露出里面金色的通道。</p>
|
||
<p>但在通道深处，林克看到了黑色的雾气在蠕动。</p>
|
||
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
|
||
<p>"小心。"林克抽出光剑「细雪之舞」。</p>
|
||
<p>剑身散发出冰蓝色的光芒，照亮了通道。</p>
|
||
<p>两人缓缓进入神殿。</p>
|
||
<p>通道两侧的墙壁上刻着神族的符文，散发着微弱的光明之力。</p>
|
||
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
|
||
<p>突然，黑色的雾气涌来。</p>
|
||
<p>"来了！"林克喊道。</p>
|
||
<p>雾气凝聚成黑色的人形，向林克扑来。</p>
|
||
<p>那是暗影生物——被暗影侵蚀的神族灵魂。</p>
|
||
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
|
||
<p>林克挥剑斩向暗影生物。</p>
|
||
<p>"流心·刺！"</p>
|
||
<p>剑光如流星般刺穿暗影生物。</p>
|
||
<p>暗影生物发出尖锐的嘶叫，化作黑色的雾气消散。</p>
|
||
<p>但更多的暗影生物涌来，数量越来越多。</p>
|
||
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
|
||
<p>"林克，用创世之力！"艾琳娜喊道。</p>
|
||
<p>林克点头，创世之力注入剑身。</p>
|
||
<p>剑光变得更加耀眼，带着净化之力。</p>
|
||
<p>"拔刀斩！"</p>
|
||
<p>巨大的剑光横扫，将暗影生物群全部斩杀。</p>
|
||
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
|
||
<p>暗影生物消散后，林克看向艾琳娜。</p>
|
||
<p>"这些就是暗影生物？"</p>
|
||
<p>艾琳娜点头："是的。"</p>
|
||
<p>"它们是被暗影侵蚀的灵魂。"</p>
|
||
<p>"它们失去了意识，只剩下吞噬的本能。"</p>
|
||
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
|
||
<p>林克眼神凝重。</p>
|
||
<p>这些暗影生物虽然不强，但数量众多。</p>
|
||
<p>如果暗影侵蚀继续蔓延，神界会陷入更大的危机。</p>
|
||
<p>"我们继续前进。"林克说。</p>
|
||
<p>两人深入神殿，向光明之源前进。</p>
|
||
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
|
||
<p>神殿深处。</p>
|
||
<p>巨大的光明之源悬浮在空中。</p>
|
||
<p>那是一颗金色的水晶，散发着纯净的光明之力。</p>
|
||
<p>但在水晶周围，黑色的雾气正在侵蚀光明之源。</p>
|
||
<p>光明之源的光芒在逐渐暗淡。</p>
|
||
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
|
||
<p>"光明之源...被暗影侵蚀了。"艾琳娜震惊地说。</p>
|
||
<p>林克握紧剑，准备战斗。</p>
|
||
<p>他知道，这只是开始。</p>
|
||
<p>更大的危险，还在后面。</p>
|
||
<p style="text-align: center; color: var(--text-secondary); text-indent: 0;">···</p>
|
||
<p style="text-align: center; color: var(--text-secondary); text-indent: 0; margin-top: 2em;">（第一百八十三章完）</p>
|
||
</article>
|
||
</div>
|
||
<nav class="fixed-nav">
|
||
<div class="fixed-nav-content">
|
||
<a href="chapter-182.html" class="nav-btn">上一章</a>
|
||
<a href="../chapters.html" class="nav-btn">目录</a>
|
||
<button class="nav-btn" id="themeToggle">切换主题</button>
|
||
<a href="chapter-184.html" class="nav-btn">下一章</a>
|
||
</div>
|
||
</nav>
|
||
<div class="scroll-buttons">
|
||
<button class="scroll-btn" id="scrollTop">顶</button>
|
||
<button class="scroll-btn" id="scrollBottom">底</button>
|
||
</div>
|
||
<aside class="sidebar">
|
||
<div class="sidebar-title">章节导航</div>
|
||
<div class="sidebar-content">
|
||
<a href="chapter-178.html" class="sidebar-chapter">第178章：番外·奥兹玛的遗言</a>
|
||
<a href="chapter-179.html" class="sidebar-chapter">第179章：神之召唤</a>
|
||
<a href="chapter-180.html" class="sidebar-chapter">第180章：通往神界之路</a>
|
||
<a href="chapter-181.html" class="sidebar-chapter">第181章：云端之城</a>
|
||
<a href="chapter-182.html" class="sidebar-chapter">第182章：神界议会</a>
|
||
<a href="chapter-183.html" class="sidebar-chapter current">第183章：暗影初现</a>
|
||
</div>
|
||
</aside>
|
||
<script>
|
||
const savedTheme = localStorage.getItem('theme') || 'dark';
|
||
document.documentElement.setAttribute('data-theme', savedTheme);
|
||
document.getElementById('themeToggle').textContent = savedTheme === 'dark' ? '浅色' : '深色';
|
||
document.getElementById('themeToggle').addEventListener('click', () => {
|
||
const newTheme = document.documentElement.getAttribute('data-theme') === 'dark' ? 'light' : 'dark';
|
||
document.documentElement.setAttribute('data-theme', newTheme);
|
||
localStorage.setItem('theme', newTheme);
|
||
document.getElementById('themeToggle').textContent = newTheme === 'dark' ? '浅色' : '深色';
|
||
});
|
||
document.getElementById('scrollTop').addEventListener('click', () => window.scrollTo({ top: 0, behavior: 'smooth' }));
|
||
document.getElementById('scrollBottom').addEventListener('click', () => window.scrollTo({ top: document.body.scrollHeight, behavior: 'smooth' }));
|
||
</script>
|
||
</body>
|
||
</html> |