先進度存檔：待確認快照移出，index.html 快照清除
待確認/extra/site-guide.html 移至根目錄 site-guide.html、 待確認/index.html 移除。外接硬碟工作中先進 git 保護， 路徑正確性待站主確認。 Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Claude Sonnet 5
@@ -1,524 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-TW">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>水晶男孩｜全站導覽</title>
|
||||
<link rel="stylesheet" href="../assets/css/style.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
|
||||
<link rel="stylesheet" href="../assets/css/tablet.css">
|
||||
<style>
|
||||
/* 本頁專用：導覽列捲到視窗頂端後固定，不再隨頁面上移 */
|
||||
body.site-guide-page .portal-nav {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 100;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
margin: 0 0 14px;
|
||||
padding: 0.8rem clamp(16px, 4vw, 100px);
|
||||
background-color: var(--black);
|
||||
box-shadow: 0 4px 18px rgba(0, 0, 0, 0.28);
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
/* 主選單樹巢狀：data-site-guide-depth + .site-guide-nav-name */
|
||||
body.site-guide-page .site-guide-nav-table .site-guide-nav-menu-cell {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table tr[data-site-guide-depth="1"] .site-guide-nav-menu-cell {
|
||||
padding-left: 0.65rem;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table tr[data-site-guide-depth="2"] .site-guide-nav-menu-cell {
|
||||
padding-left: 1.1rem;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table tr[data-site-guide-depth="3"] .site-guide-nav-menu-cell {
|
||||
padding-left: 1.85rem;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table tr[data-site-guide-depth="4"] .site-guide-nav-menu-cell {
|
||||
padding-left: 2.6rem;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table tr[data-site-guide-depth="2"] .site-guide-nav-name::before {
|
||||
content: "——\00a0";
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table tr[data-site-guide-depth="3"] .site-guide-nav-name::before {
|
||||
content: "————\00a0";
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table tr[data-site-guide-depth="4"] .site-guide-nav-name::before {
|
||||
content: "——————\00a0";
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-nav-table tr[data-site-guide-depth] .site-guide-nav-name::before {
|
||||
display: inline;
|
||||
font-family: inherit;
|
||||
font-size: 0.92em;
|
||||
color: rgba(0, 0, 0, 0.38);
|
||||
letter-spacing: 0.02em;
|
||||
}
|
||||
|
||||
/* 站主待辦提醒（處理完 header 統整後可刪除此區與樣式） */
|
||||
body.site-guide-page .site-guide-todo-reminder {
|
||||
margin: 0 0 1.25rem;
|
||||
padding: 0.85rem 1rem;
|
||||
border: 2px solid rgba(255, 204, 0, 0.75);
|
||||
border-radius: 10px;
|
||||
background: #fffbe8;
|
||||
text-align: left;
|
||||
font-size: 0.92rem;
|
||||
line-height: 1.55;
|
||||
color: #3a300a;
|
||||
}
|
||||
|
||||
body.site-guide-page .site-guide-todo-reminder strong {
|
||||
color: #5c4a0f;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body class="site-guide-page">
|
||||
<header class="map-archive-header">
|
||||
<div class="header-inner">
|
||||
<h1 class="main-title">全站導覽</h1>
|
||||
<div class="subtitle-wrap">
|
||||
<span class="sub-title">SITE MAP · 一表為主</span>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<nav class="portal-nav" aria-label="水晶男孩推廣部導覽" data-portal-nav data-portal-nav-all-open></nav>
|
||||
|
||||
<canvas id="particles"></canvas>
|
||||
|
||||
<main class="content-container site-guide-main">
|
||||
<aside class="site-guide-todo-reminder" role="note" aria-label="站主待辦提醒">
|
||||
<p><strong>優化</strong>：內頁 header 統一 →
|
||||
<a href="../.cursor/inner-page-header-audit.md" class="mark_b">差異整理</a></p>
|
||||
</aside>
|
||||
<p class="site-guide-lead site-guide-lead--short">
|
||||
本頁為站主自用全站導覽：主表與小表連結皆可進目標頁。頂欄加 <code>data-portal-nav-all-open</code>，不套用籌備中、且為同分頁開啟；訪客可見之其他頁仍依
|
||||
<code>portal-nav.js</code> 籌備中規則與另開新分頁。
|
||||
</p>
|
||||
|
||||
<section class="site-guide-group site-guide-group--nav-hero" aria-labelledby="sg-nav-tree">
|
||||
<h2 class="section-title" id="sg-nav-tree">主選單樹</h2>
|
||||
<p class="site-guide-legend">
|
||||
<span><span class="site-guide-legend__on">●</span> 有連結</span>
|
||||
<span><span class="site-guide-legend__off">●</span> 無連結</span>
|
||||
</p>
|
||||
<div class="site-guide-nav-table-wrap">
|
||||
<table class="site-guide-nav-table">
|
||||
<caption class="site-guide-nav-caption">路徑相對站根。</caption>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">選單名稱</th>
|
||||
<th scope="col">頁面簡介</th>
|
||||
<th scope="col">連結</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr data-site-guide-depth="1">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
|
||||
href="../index.html">淪陷瞬間</a></span></td>
|
||||
<td class="site-guide-nav-desc">Hero、入坑敘事與站方初衷；LOGO 理念、宣言與跨時空軌跡時間軸。</td>
|
||||
<td class="site-guide-nav-link-cell"><a href="../index.html"><code>index.html</code></a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="2">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><span
|
||||
class="site-guide-nav-nolink">傳奇的轉折（六六歌2）</span></span></td>
|
||||
<td class="site-guide-nav-desc">四種入口（順序）：時間軸、電子書為獨立單頁；網頁版為 TOTOGA2 整合長頁（章節錨點）；影片為嵌入單頁。</td>
|
||||
<td class="site-guide-nav-link-cell"><span class="site-guide-nav-nolink">—</span></td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="3">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
|
||||
href="totoga2-copy-timeline.html">時間軸</a></span></td>
|
||||
<td class="site-guide-nav-desc">時間軸與紀實八章長文單頁。</td>
|
||||
<td class="site-guide-nav-link-cell"><a
|
||||
href="totoga2-copy-timeline.html"><code>extra/totoga2-copy-timeline.html</code></a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="3">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
|
||||
href="totoga2-copy-ebook.html">電子書</a></span></td>
|
||||
<td class="site-guide-nav-desc">紀實電子書內容獨立成頁。</td>
|
||||
<td class="site-guide-nav-link-cell"><a
|
||||
href="totoga2-copy-ebook.html"><code>extra/totoga2-copy-ebook.html</code></a></td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="3">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
|
||||
href="../fallen/totoga2.html">圖文好讀版</a></span></td>
|
||||
<td class="site-guide-nav-desc">單頁整合：影片／電子書／長文模式切換與八章錨點。</td>
|
||||
<td class="site-guide-nav-link-cell"><a
|
||||
href="../fallen/totoga2.html"><code>fallen/totoga2.html</code></a></td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="3">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
|
||||
href="totoga2-video.html">影片</a></span></td>
|
||||
<td class="site-guide-nav-desc">無限挑戰 · 六六歌2 嵌入影片單頁。</td>
|
||||
<td class="site-guide-nav-link-cell"><a
|
||||
href="totoga2-video.html"><code>extra/totoga2-video.html</code></a></td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="2">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><span
|
||||
class="site-guide-nav-nolink">全員發瘋</span></span></td>
|
||||
<td class="site-guide-nav-desc">—</td>
|
||||
<td class="site-guide-nav-link-cell"><span class="site-guide-nav-nolink">—</span></td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="3">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
|
||||
href="../variety/variety.html#variety">隊長帶弟弟</a></span></td>
|
||||
<td class="site-guide-nav-desc">綜藝頁「瘋狂出演中」主區；與頂欄「隊長帶弟弟」同頁錨點。</td>
|
||||
<td class="site-guide-nav-link-cell"><a
|
||||
href="../variety/variety.html#variety"><code>variety/variety.html#variety</code></a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="3">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><span
|
||||
class="site-guide-nav-nolink">各自暴走</span></span></td>
|
||||
<td class="site-guide-nav-desc">—</td>
|
||||
<td class="site-guide-nav-link-cell"><span class="site-guide-nav-nolink">—</span></td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="4">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
|
||||
href="../variety/NJTW/NJTW5.html">新西遊記</a></span></td>
|
||||
<td class="site-guide-nav-desc">與鬼神同行企劃文案、六人介紹與 OB／YB 雙隊版面。</td>
|
||||
<td class="site-guide-nav-link-cell"><a
|
||||
href="../variety/NJTW/NJTW5.html"><code>variety/NJTW/NJTW5.html</code></a></td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="1">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
|
||||
href="../member/member.html">完整的六顆</a></span></td>
|
||||
<td class="site-guide-nav-desc">黑／白水晶六人海報板、團名典故與成員靜態介紹。</td>
|
||||
<td class="site-guide-nav-link-cell"><a
|
||||
href="../member/member.html"><code>member/member.html</code></a></td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="1">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
|
||||
href="../concert/concert.html">現場的震撼</a></span></td>
|
||||
<td class="site-guide-nav-desc">巡迴場次、場館與曲目展開；搜尋曲目或場次。</td>
|
||||
<td class="site-guide-nav-link-cell"><a
|
||||
href="../concert/concert.html"><code>concert/concert.html</code></a></td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="2">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
|
||||
href="../concert/concert.html">集結水晶</a></span></td>
|
||||
<td class="site-guide-nav-desc">巡迴場次、場館與曲目展開；搜尋曲目或場次。</td>
|
||||
<td class="site-guide-nav-link-cell"><a
|
||||
href="../concert/concert.html"><code>concert/concert.html</code></a></td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="2">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><span
|
||||
class="site-guide-nav-nolink">隊長的氣場</span></span></td>
|
||||
<td class="site-guide-nav-desc">—</td>
|
||||
<td class="site-guide-nav-link-cell"><span class="site-guide-nav-nolink">—</span></td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="1">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
|
||||
href="../albums/albums.html">黃色留聲機</a></span></td>
|
||||
<td class="site-guide-nav-desc">導聽文案；新篇章與全盛期年表、深水連結與曲目表。</td>
|
||||
<td class="site-guide-nav-link-cell"><a
|
||||
href="../albums/albums.html"><code>albums/albums.html</code></a></td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="2">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
|
||||
href="../albums/albums.html#new">啟動新篇章</a></span></td>
|
||||
<td class="site-guide-nav-desc">回歸後數位單曲／專輯敘事與代表曲目表。</td>
|
||||
<td class="site-guide-nav-link-cell"><a
|
||||
href="../albums/albums.html#new"><code>albums/albums.html#new</code></a></td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="2">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
|
||||
href="../albums/albums.html#classic">輝煌全盛期</a></span></td>
|
||||
<td class="site-guide-nav-desc">1997–1999 全盛期年表、專輯列與主打記憶整理。</td>
|
||||
<td class="site-guide-nav-link-cell"><a
|
||||
href="../albums/albums.html#classic"><code>albums/albums.html#classic</code></a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="1">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
|
||||
href="../yellow-note/map.html">Yellow Note</a></span></td>
|
||||
<td class="site-guide-nav-desc">台灣行程表、成員行程篩選、搜尋與地圖主體。</td>
|
||||
<td class="site-guide-nav-link-cell"><a
|
||||
href="../yellow-note/map.html"><code>yellow-note/map.html</code></a></td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="2">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
|
||||
href="../yellow-note/minister.html">視覺進化論</a></span></td>
|
||||
<td class="site-guide-nav-desc">「從好奇到全端」自述與時間軸式章節段落。</td>
|
||||
<td class="site-guide-nav-link-cell"><a
|
||||
href="../yellow-note/minister.html"><code>yellow-note/minister.html</code></a></td>
|
||||
</tr>
|
||||
<tr data-site-guide-depth="2">
|
||||
<td class="site-guide-nav-menu-cell"><span class="site-guide-nav-name"><a
|
||||
href="../yellow-note/map.html">聖地巡禮</a></span></td>
|
||||
<td class="site-guide-nav-desc">台灣行程表、成員行程篩選、搜尋與地圖主體。</td>
|
||||
<td class="site-guide-nav-link-cell"><a
|
||||
href="../yellow-note/map.html"><code>yellow-note/map.html</code></a></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<h3 class="site-guide-subh" id="sg-rules-quick">一般頁籌備中（掃一眼）</h3>
|
||||
<div class="site-guide-nav-table-wrap">
|
||||
<table class="site-guide-mini-table" aria-describedby="sg-rules-quick">
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row"><code>COMING_SOON_PAGES</code></th>
|
||||
<td><code>albums</code>、<code>yellow-note/map</code>、<code>minister</code>、<code>minister_ge</code>、<code>totoga2</code>、<code>variety</code>
|
||||
檔名 → 一般頁改 <code>#</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row"><code>INDEX_NAV_OPEN_HASHES</code></th>
|
||||
<td>僅 <code>index.html</code>
|
||||
無片段、<code>#origin</code>、<code>#start</code>、<code>#mission</code>、<code>#timeline</code>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">固定</th>
|
||||
<td>「隊長的氣場」與 Set 無關</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<p class="site-guide-fine-print site-guide-fine-print--center">綜藝主頁：<a
|
||||
href="../variety/variety.html">variety.html</a></p>
|
||||
</section>
|
||||
|
||||
<section class="site-guide-group" aria-labelledby="sg-nav-origin">
|
||||
<h2 class="section-title" id="sg-nav-origin">淪陷瞬間 <span class="site-guide-nav-sub">站根</span></h2>
|
||||
<div class="site-guide-nav-table-wrap">
|
||||
<table class="site-guide-mini-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">頁／錨點</th>
|
||||
<th scope="col">用途</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><a href="../index.html">index.html</a></td>
|
||||
<td>首頁 Hero</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="../index.html#start">#start</a> 等</td>
|
||||
<td>區塊錨點（<code>#story</code> 不在頂欄白名單）</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="totoga2-copy-timeline.html">時間軸</a></td>
|
||||
<td>平行單頁 · <code>totoga2-copy-timeline.html</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="totoga2-copy-ebook.html">電子書</a></td>
|
||||
<td>平行單頁 · <code>totoga2-copy-ebook.html</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="../fallen/totoga2.html">圖文好讀版</a></td>
|
||||
<td>整合長頁 · <code>fallen/totoga2.html</code></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="totoga2-video.html">影片</a></td>
|
||||
<td>平行單頁 · <code>totoga2-video.html</code></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="site-guide-grid site-guide-grid--compact">
|
||||
<article class="site-guide-card site-guide-card--totoga2">
|
||||
<h3><a href="../fallen/totoga2.html">六六歌2 · 四入口</a></h3>
|
||||
<p class="site-guide-note">複本總覽：<a href="totoga2%20copy.html">totoga2 copy.html</a>。章節錨點僅在圖文好讀版內。
|
||||
</p>
|
||||
<ul class="site-guide-inline-links">
|
||||
<li><a href="totoga2-copy-timeline.html">時間軸</a></li>
|
||||
<li><a href="totoga2-copy-ebook.html">電子書</a></li>
|
||||
<li><a href="../fallen/totoga2.html">圖文好讀版</a></li>
|
||||
<li><a href="totoga2-video.html">影片</a></li>
|
||||
</ul>
|
||||
<nav class="site-guide-chapter-nav" aria-label="totoga2 章節">
|
||||
<a href="../fallen/totoga2.html#challenge">無限挑戰</a>
|
||||
<a href="../fallen/totoga2.html#ssg2">六六歌2</a>
|
||||
<a href="../fallen/totoga2.html#sechskies-profile">水晶男孩</a>
|
||||
<a href="../fallen/totoga2.html#gather">召集</a>
|
||||
<a href="../fallen/totoga2.html#negotiate">交涉</a>
|
||||
<a href="../fallen/totoga2.html#variables">變數</a>
|
||||
<a href="../fallen/totoga2.html#surprise">驚喜</a>
|
||||
<a href="../fallen/totoga2.html#final-stage">登場</a>
|
||||
</nav>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="site-guide-group" aria-labelledby="sg-nav-member">
|
||||
<h2 class="section-title" id="sg-nav-member">完整的六顆</h2>
|
||||
<div class="site-guide-nav-table-wrap">
|
||||
<table class="site-guide-mini-table">
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">頁</th>
|
||||
<td><a href="../member/member.html">member/member.html</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">錨點</th>
|
||||
<td><a href="../member/member.html#crystal-board">#crystal-board</a></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="site-guide-group" aria-labelledby="sg-nav-concert">
|
||||
<h2 class="section-title" id="sg-nav-concert">現場的震撼</h2>
|
||||
<div class="site-guide-nav-table-wrap">
|
||||
<table class="site-guide-mini-table">
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">集結水晶</th>
|
||||
<td><a href="../concert/concert.html">concert.html</a> · <a
|
||||
href="../concert/concert.html#stage-now">#stage-now</a> · <a
|
||||
href="../concert/concert.html#stage-past">#stage-past</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">隊長的氣場</th>
|
||||
<td>—</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="site-guide-group" aria-labelledby="sg-nav-albums">
|
||||
<h2 class="section-title" id="sg-nav-albums">黃色留聲機</h2>
|
||||
<div class="site-guide-nav-table-wrap">
|
||||
<table class="site-guide-mini-table">
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">典藏</th>
|
||||
<td><a href="../albums/albums.html">albums.html</a> · <a
|
||||
href="../albums/albums.html#new">#new</a> · <a
|
||||
href="../albums/albums.html#classic">#classic</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">歌詞</th>
|
||||
<td><a href="lyrics.html">extra/lyrics.html</a>（未列主欄）</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="site-guide-group" aria-labelledby="sg-nav-yellow-note">
|
||||
<h2 class="section-title" id="sg-nav-yellow-note">Yellow Note</h2>
|
||||
<div class="site-guide-nav-table-wrap">
|
||||
<table class="site-guide-mini-table">
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">視覺</th>
|
||||
<td><a href="../yellow-note/minister.html">yellow-note/minister.html</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">minister 長版</th>
|
||||
<td><a href="minister_ge.html">minister_ge.html</a>（備份；未列頂欄）</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">地圖</th>
|
||||
<td><a href="../yellow-note/map.html">map.html</a> · <a
|
||||
href="../yellow-note/map.html#taipei">#taipei</a> · <a
|
||||
href="../yellow-note/map.html#global">#global</a></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="site-guide-group" aria-labelledby="sg-nav-variety">
|
||||
<h2 class="section-title" id="sg-nav-variety">variety/（無主欄）</h2>
|
||||
<div class="site-guide-nav-table-wrap">
|
||||
<table class="site-guide-mini-table">
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">主頁</th>
|
||||
<td><a href="../variety/variety.html">variety.html</a> · <a
|
||||
href="../variety/variety.html#variety">#variety</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">NJTW5</th>
|
||||
<td><a href="../variety/NJTW/NJTW5.html">NJTW5.html</a></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="site-guide-group site-guide-group--extra" aria-labelledby="sg-nav-extra">
|
||||
<h2 class="section-title" id="sg-nav-extra">extra/ 其餘</h2>
|
||||
<p class="site-guide-folder-hint">未列頂欄主模板之草稿／實驗頁。主選單對應頁面已移至
|
||||
<code>fallen/</code>、<code>member/</code>、<code>yellow-note/</code>、<code>variety/</code> 等資料夾；六六歌2
|
||||
四入口之複本仍在本目錄。</p>
|
||||
<div class="site-guide-nav-table-wrap">
|
||||
<table class="site-guide-mini-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">檔案</th>
|
||||
<th scope="col">備註</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><a href="site-guide.html">site-guide.html</a></td>
|
||||
<td>全站導覽（本頁）</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="grok.html">grok.html</a></td>
|
||||
<td>實驗單頁</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="totoga2%20copy.html">totoga2 copy.html</a></td>
|
||||
<td>複本總覽</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="Untitled-1.html">Untitled-1.html</a></td>
|
||||
<td>草稿</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="sunghoon.html">sunghoon.html</a></td>
|
||||
<td>—</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><a href="minister_ge.html">minister_ge.html</a></td>
|
||||
<td>minister 長版備份（Yellow Note 小節亦列）</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<p>SECHSKIES Fanpage © 2026 - 黃色氣球永遠飄揚</p>
|
||||
<a href="https://jekkinoopy.github.io/Portfolio/" class="studio-link" target="_blank">
|
||||
Design by <span class="mark_b">Jekkinoopy Studio</span>
|
||||
</a>
|
||||
</footer>
|
||||
|
||||
<script src="../assets/js/particles.js"></script>
|
||||
<script src="../assets/js/portal-nav.js"></script>
|
||||
<script>
|
||||
/* 全站導覽頁：頂欄改為同分頁開啟（他頁仍由 portal-nav 另開） */
|
||||
(function () {
|
||||
document.querySelectorAll("body.site-guide-page nav.portal-nav a[target=\"_blank\"]").forEach(function (a) {
|
||||
a.removeAttribute("target");
|
||||
a.removeAttribute("rel");
|
||||
});
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
-236
@@ -1,236 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-TW">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>SECHSKIES - 水晶男孩傳奇介紹</title>
|
||||
<link rel="stylesheet" href="assets/css/style.css">
|
||||
<link rel="stylesheet" href="assets/css/index.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
|
||||
<link rel="stylesheet" href="assets/css/tablet.css">
|
||||
|
||||
</head>
|
||||
|
||||
<body class="home-page">
|
||||
<header id="origin">
|
||||
<div class="hero">
|
||||
<h1>SECHSKIES<br>水晶男孩</h1>
|
||||
<div class="subtitle-wrap">
|
||||
<span class="sub-title">六顆永恆的水晶 • 左右命運的傳奇</span>
|
||||
</div>
|
||||
<a href="#start" class="btn">從這裡開始淪陷</a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<nav class="portal-nav" aria-label="水晶男孩推廣部導覽" data-portal-nav></nav>
|
||||
|
||||
<canvas id="particles"></canvas>
|
||||
|
||||
<div class="container">
|
||||
|
||||
<section id="start">
|
||||
<h2 class="section-title">好奇的開端</h2>
|
||||
<div class="intro-text">
|
||||
<p class="core-description">
|
||||
這段旅程始於 2016 年 4 月，透過國民綜藝<span class="mark_b mark_y">《無限挑戰》</span>的回歸企劃，讓原本不認識這組傳奇的我，因一時好奇點開節目。
|
||||
即便錯過了那個屬於他們的世紀末，但跟著節目的編排鋪陳，從歡笑到感動，我被這些熱血、真誠且專業的大男孩所震撼。
|
||||
</p>
|
||||
<p class="call-to-action">
|
||||
身為在回歸後才被這場 <span class="mark_b mark_y">「黃色奇蹟」</span>
|
||||
擊中的新一代粉絲，我深刻體會那種從好奇觀看到最終徹底淪陷的悸動。這種從<span class="mark_b"><span class="fan-journey-wave"
|
||||
role="text">路人 <i class="fa-solid fa-circle-right"
|
||||
aria-hidden="true"></i> 入坑否定期 <i class="fa-solid fa-circle-right"
|
||||
aria-hidden="true"></i> 瘋狂考古期 <i class="fa-solid fa-circle-right"
|
||||
aria-hidden="true"></i> 坑底躺平深陷其中</span></span>的過程，證明了魅力可以跨越時間，也正是這一切自我覺醒的起點，驅動我不斷進化的無限可能。
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
<section id="mission" class="mission-section">
|
||||
<div class="mission-zigzag">
|
||||
<div class="mission-row mission-row--intro">
|
||||
<div class="mission-row__visual">
|
||||
<div class="logo-wrapper">
|
||||
<img src="./assets/images/logo.png" alt="SECHSKIES Logo Concept">
|
||||
<div class="caption">
|
||||
<span class="caption__line caption__line--title"><span class="arrow-icon mark_b"
|
||||
aria-hidden="true">↑</span>設計概念：</span>
|
||||
<span class="caption__line">六角形水晶、黃色海洋與我們的初心Six</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mission-row__body">
|
||||
<h2 class="section-title mission-block-title">成立的初衷</h2>
|
||||
<p class="mission-lead">
|
||||
以推廣 SECHSKIES <span class="mark_y">水晶男孩</span> 為核心，旨在透過 <span
|
||||
class="mark_b">專業的視覺策展</span> 宣傳成員魅力與小黃們的應援活動。嘗試以水晶男孩為
|
||||
<span class="mark_b">靈感主軸</span>，延伸至
|
||||
<span class="mark_b">網頁開發、視覺設計與內容企劃</span>
|
||||
等多重領域，將對偶像的喜愛轉化為 <span class="mark_b">實質的專業養分</span>。在這裡，你不只能探索他們的 <span
|
||||
class="mark_b">傳奇軌跡</span>，更能見證追星如何激發 <span class="mark_b">創作潛能</span>。
|
||||
</p>
|
||||
<div class="slogan-quote slogan-quote--mission">
|
||||
<span class="slogan-quote__inner">我要用這座<span
|
||||
class="mark_b">藝廊般的網站</span>證明：<br>追星的孩子不僅不會變壞，更會因為那份<span
|
||||
class="mark_b">守護並推廣的熱情</span>，<br>讓現在的自己變得比追星前的自己還要厲害!</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mission-row mission-row--concept">
|
||||
<div class="mission-row__body">
|
||||
<h3 class="mission-logo-heading">LOGO 設計理念</h3>
|
||||
<p>
|
||||
<span class="mark_b">「晶」</span>字發想來自<span class="mark_b">六角形的水晶</span>，為了強調水晶男孩<span
|
||||
class="mark_b">初心為六人</span>。上半部形似<span class="mark_b">數字
|
||||
6</span>，搭配演唱會必備的<span class="mark_b">手燈圖案</span>，代表粉絲和水晶<span
|
||||
class="mark_b">密不可分的關係</span>。<br>色彩配置發想來自無限挑戰六六歌特輯的回歸舞台，成員脫下眼罩的剎那，整個場地從<span
|
||||
class="mark_b mark_y">一片漆黑瞬間發亮</span>，映入眼簾的是一片<span class="mark_b">黃色海洋</span>，<span
|
||||
class="mark_y">讓成員和粉絲的世界跟著亮了起來</span>。以此片段為契機，設計成<span
|
||||
class="mark_b">黑色系與黃色系</span>的色彩搭配，來記錄那瞬間的感動。
|
||||
</p>
|
||||
</div>
|
||||
<div class="mission-row__visual">
|
||||
<div class="mission-moment-wrap">
|
||||
<div class="mission-gif-frame" role="group" aria-label="回歸演唱會／黃色氣球海（16：9）">
|
||||
<!-- 若改為 GIF 動圖，將底下 src 換成 ./assets/images/mission-balloon-sea.gif 即可 -->
|
||||
<img src="./assets/images/黃色海洋.gif" alt="無限挑戰 六六歌2 放送畫面：全場黃色氣球海">
|
||||
</div>
|
||||
<span class="caption">
|
||||
<span class="arrow-icon" aria-hidden="true">↑</span>
|
||||
回歸演唱會的動人瞬間-黃色氣球海
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<section id="timeline" class="story-archive">
|
||||
<h2 class="section-title">跨時空軌跡</h2>
|
||||
<div class="subtitle-wrap">
|
||||
<span class="sub-title">SECHSKIES STORY ARCHIVE</span>
|
||||
</div>
|
||||
|
||||
<div class="merged-storyline">
|
||||
<article class="story-node" data-era="1997">
|
||||
<h3>傳奇的誕生：六道光芒劃破韓流夜空</h3>
|
||||
<p>1997年4月15日，水晶男孩以強悍的《學園別曲》為起點，「黑水晶｜Rap與舞蹈」、「白水晶｜主唱」的雙色魅力交織，奠定了
|
||||
K-POP第一代傳奇的地位，開創了屬於黃色海洋的盛世與巔峰。</p>
|
||||
<p>在那段被韓劇<a
|
||||
href="https://www.disneyplus.com/browse/entity-3979fb82-8681-44e8-b7be-e313091f0d73?distributionPartner=google"
|
||||
class="story-external-inline" target="_blank" rel="noopener noreferrer"><span
|
||||
class="story-external-inline__label">《請回答1997》</span><i
|
||||
class="fa-solid fa-arrow-up-right-from-square" aria-hidden="true"></i></a>奉為經典的歲月裡，水晶男孩與
|
||||
H.O.T.
|
||||
並稱為兩大巔峰。無論是雨中那場被劇集致敬的粉絲大戰，還是為了買票露宿街頭的狂熱，白與黃的旗幟對決，成了那個世代集體記憶的起點。</p>
|
||||
</article>
|
||||
|
||||
<article class="story-node" data-era="2000">
|
||||
<h3>遺憾的休止符：凍結有你的世界</h3>
|
||||
<p>在最燦爛的時刻，這首華麗的樂章卻被迫畫下了休止符，2000年5月正式解散。成員各自發展走出了不同道路，水晶進入休眠期。
|
||||
</p>
|
||||
<p>那一場如同劇中描寫般、讓全韓無數少女世界崩塌的夢想演唱會告別現場，將未完的旋律封存在冷冽的空氣中。這一停頓，就是長達十六年的靜默，成為我們心中最完整、卻也最令人心碎的凝煉模樣。
|
||||
</p>
|
||||
</article>
|
||||
<article class="story-node story-node--ebook-ssg2" data-era="2016">
|
||||
<h3>感動合體：那一晚，我們找回了完整</h3>
|
||||
<p>塵封十六年的時光被溫柔拂去，跨越六千多天的等待，黃色氣球海再次淹沒了上岩運動場。當六個身影重新站在一起，那幅曾被凍結在 2000
|
||||
年的畫面終於再次「溶解」並重合。那一晚，淚水證明了奇蹟真的存在，我們終於找回了那份久違的完整，以為故事從此能圓滿續寫。</p>
|
||||
<span class="timeline-ebook-cta" aria-label="傳奇書寫中，連結暫停">
|
||||
<span>點我見證傳奇</span><i class="fa-solid fa-hand-pointer" aria-hidden="true"></i>
|
||||
</span>
|
||||
</article>
|
||||
<!-- 2016 年後續發展與情感轉折區塊 -->
|
||||
<article class="story-node" data-era="2016.05">
|
||||
<h3>從路人到鐵粉：從夢境進現實</h3>
|
||||
|
||||
<p>《無限挑戰》落幕後，原本以為這只是最後一場華麗的告別。在那段連期待都不敢奢侈、只能在螢幕前渴求消息的沈默裡，5 月 11
|
||||
日的簽約消息像是一記響亮的耳光，將所有人從絕望中打醒。那是從未知的空虛到塵埃落定的震撼——原來這不是終點，奇蹟真的在現實生了根。</p>
|
||||
|
||||
<p>四月的重逢是老小黃們守候十六年的淚水；而九月的單獨演唱會，則讓無數新小黃見證了那份無法動搖的羈絆。在那片黃色海洋裡，我們不只愛上了水晶男孩，更愛上了他們與小黃之間那種跨越時空的愛情。雖然遺憾沒能看見六人並肩的畫面，但那股新舊交織的生命力，確實為水晶注入了新的靈魂。
|
||||
</p>
|
||||
|
||||
<p>這份陪伴在十二月有了溫柔的延續。志溶雖然未回歸舞台，卻在《超回》中以最真實、幸福的模樣走入大家的生活。舞台上的空位雖讓心底隱隱作痛，但看著他幸福的樣子，我們才明白：原來大家只是換個方式一起變老，這份情誼早已超越了表演。
|
||||
</p>
|
||||
</article>
|
||||
<article class="story-node" data-era="2016">
|
||||
<h3>從路人到鐵粉：從夢境進現實</h3>
|
||||
<p>當《無限挑戰》的燈光熄滅，原本以為這場跨越十六年的重逢僅是曇花一現的夢境，但隨後五位成員與 YG
|
||||
簽約的消息，正式宣告了傳奇的歸來。九月演唱會上，新舊粉絲在黃色海洋中見證了跨越時空的強烈羈絆，那種心意相通的悸動，讓我們知道這道光從未真正熄滅過。</p>
|
||||
|
||||
<p>而志溶雖然未參與合體，卻在十二月演唱會落幕當天，透過《超人回來了》的預告驚喜現身。這不是告別，而是他選擇以另一種最真實、最溫馨的形式，在現實生活中繼續陪伴著大家。舞台上的空位雖然令人難過，但看到他帶著孩子幸福的模樣，我們才明白：原來水晶與粉絲的羈絆，早已超越了表演的定義，而是要在彼此的生活裡，一起變老，一起寫下新的篇章。
|
||||
</p>
|
||||
### 餘溫與新生：從奇蹟走向恆久
|
||||
|
||||
<p>當《無限挑戰》的燈光熄滅，原以為那場重逢只是十六年一次的曇花一現。同年五月，五位成員與 YG
|
||||
簽約的消息，讓夢境落實成了現實。四月的「六六歌」是屬於老粉絲守候十六年的淚水與重逢；而九月的個人演唱會，則是一場關於愛情的傳承。無數新粉絲透過黃色海洋，目睹了偶像與歌迷間那種超越時空的生死契闊，雖然志溶未能站上舞台成了這場盛宴唯一的遺憾，但那種「水晶男孩」與「黃飯」共生的生命力，卻從那一刻起，重新注入了新的靈魂。
|
||||
</p>
|
||||
|
||||
<p>這份羈絆在十二月有了更溫柔的延續。演唱會落幕當晚，志溶帶著孩子在《超人回來了》預告中驚喜現身。這不是告別，而是他換了一種最真實的形式，在現實生活中守護著這份情誼。舞台上的空位雖讓心底隱隱作痛，但看著他幸福的模樣，我們才懂得：水晶男孩的定義早已超越了表演，而是彼此約好在不同的時空裡，也要一起變老，一起寫下永不終結的篇章。
|
||||
</p>
|
||||
</article>
|
||||
<article class="story-node" data-era="2019">
|
||||
<h3>體制調整與穩定</h3>
|
||||
<p>調整為四人組合（殷志源、李宰鎮、金在德、張水院），繼續以經典魅力活躍於樂壇與綜藝。</p>
|
||||
</article>
|
||||
|
||||
<article class="story-node" data-era="NOW">
|
||||
<h3>至今：個人與團體並行</h3>
|
||||
<p>隊長殷志源活躍於各類綜藝節目，成員們也積極參與音樂與個人品牌活動。雖然活動節奏放緩，但水晶男孩仍是 K-POP 史上的長壽標竿。</p>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
<!--
|
||||
<section id="story" class="story-archive">
|
||||
<h2 class="section-title">傳奇的轉折</h2>
|
||||
<div class="subtitle-wrap">
|
||||
<span class="sub-title">PLOT TWIST</span>
|
||||
</div>
|
||||
<p class="intro-text">
|
||||
像劇情的反轉一樣過癮：這幾個節點，剛好是許多人從「旁觀綜藝」滑進「正式入坑」的轉軌。若想讀對白級細節，請開
|
||||
<a href="fallen/totoga2.html">六六歌2 整合專區</a>（影片／電子書／紀實長文八章，同一頁切換模式即可）。
|
||||
</p>
|
||||
<div class="story-ebook-cta">
|
||||
<a href="fallen/totoga2.html#ebook" class="btn story-ebook-btn">開啟六六歌2 紀實電子書</a>
|
||||
<a href="fallen/totoga2.html" class="btn story-ebook-btn">六六歌2 整合專區</a>
|
||||
</div>
|
||||
|
||||
<div class="merged-storyline">
|
||||
<article id="special" class="story-node" data-era="六六歌">
|
||||
<h3>六六歌實錄</h3>
|
||||
<p>把懸念、試探與哭點縫在同一條時間軸上；很多人第一次真正把「水晶男孩」打進搜尋框，就是從這種瘋狂的剪輯節奏開始。</p>
|
||||
<p><a href="fallen/totoga2.html#ssg2">對照這一段幕後敘事</a></p>
|
||||
</article>
|
||||
<article id="negotiate" class="story-node" data-era="交涉">
|
||||
<h3>命運的交涉</h3>
|
||||
<p>KTV、游擊演唱會規則、與其說講道理不如說把真心擺上桌面——交涉的不是合約字面，而是還願不願意再一次肩並肩。</p>
|
||||
<p><a href="fallen/totoga2.html#negotiate">讀交涉與對話肌理</a></p>
|
||||
</article>
|
||||
<article id="complete" class="story-node" data-era="歸位">
|
||||
<h3>拼圖的歸位</h3>
|
||||
<p>變數一個個被排除之後，驚喜接上登場段落；缺一角舞台的視覺，終於對齊觀眾席上堅守的那片黃。</p>
|
||||
<p><a href="fallen/totoga2.html#gather">從「召集」段開始補這條線</a></p>
|
||||
</article>
|
||||
<article id="past" class="story-node" data-era="最初">
|
||||
<h3>巔峰與雨天</h3>
|
||||
<p>急凍、告別、各自的跑道——並不是要你沉浸遺憾，而是讓你懂：後來每一次亮燈，為什麼會更值得尖叫。</p>
|
||||
<p><a href="fallen/totoga2.html#sechskies-profile">讀這條脈絡的起點</a></p>
|
||||
</article>
|
||||
</div>
|
||||
</section> -->
|
||||
</div>
|
||||
|
||||
<footer>
|
||||
<p>SECHSKIES Fanpage © 2026 - 黃色氣球永遠飄揚</p>
|
||||
<a href="https://jekkinoopy.github.io/Portfolio/" class="studio-link" target="_blank">
|
||||
Design by <span class="mark_b">Jekkinoopy Studio</span>
|
||||
</a>
|
||||
</footer>
|
||||
|
||||
<script src="assets/js/particles.js"></script>
|
||||
<script src="assets/js/portal-nav.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user