Template:首页导航：修订间差异

@@ 第1行： / 第1行： @@
-<table class="nav-table" style="width:90%;margin:20px auto;border-collapse:separate;border-spacing:0;font-family:Arial,sans-serif;box-shadow:0 2px 10px rgba(0,0,0,0.1);border-radius:16px;overflow:hidden;">
+<div id="mainpagenav" style="
-<tr style="background-color:#4CAF50;color:white;font-size:1.2em;height:60px;">
+  max-width: 100%;
-<th colspan="4" style="border-top-left-radius:16px;border-top-right-radius:16px;">精简导航</th>
+  margin: 16px auto;
-</tr>
+  border: 1px solid var(--border-color-base, #a2a9b1);
-<tr>
+  background-color: var(--color-surface-0, #ffffff);
-<td style="width:25%;padding:12px 15px;border:1px solid #ddd;text-align:center;vertical-align:middle;">[[首页/动物园文化＆吉吉国文化|动物园文化＆吉吉国文化]]</td>
+  color: var(--color-base, #202122);
-<td style="width:25%;padding:12px 15px;border:1px solid #ddd;text-align:center;vertical-align:middle;">[[首页/哈基米音乐|哈基米音乐]]</td>
+  box-sizing: border-box;
-<td style="width:25%;padding:12px 15px;border:1px solid #ddd;text-align:center;vertical-align:middle;">[[首页/蕾忍宗|蕾忍宗]]</td>
+">
-<td style="width:25%;padding:12px 15px;border:1px solid #ddd;text-align:center;vertical-align:middle;">[[首页/木柜子|木柜子]]</td>
+  <!-- 标题区域 -->
-</tr>
+  <div style="
-<tr style="background-color:#f8f8f8;">
+    background-color: var(--color-primary, #36c);
-<td style="width:25%;padding:12px 15px;border:1px solid #ddd;text-align:center;vertical-align:middle;">
+    color: #ffffff;
-* [[首页/动物园文化＆吉吉国文化/电棍otto|电棍otto]]
+    padding: 12px 16px;
-* [[首页/动物园文化＆吉吉国文化/山泥若|山泥若]]
+    font-weight: 700;
-* [[首页/动物园文化＆吉吉国文化/炫神|炫神]]</td>
+    font-size: 1.1em;
-<td style="width:25%;padding:12px 15px;border:1px solid #ddd;text-align:center;vertical-align:middle;">
+    letter-spacing: 0.05em;
-* [[猫反七]]
+    text-transform: uppercase;
-* [[坚韧]]
+    border-bottom: 1px solid var(--border-color-subtle, #004bb3);
-* [[圆头耄耋]]
+  ">
-* [[燃尽了的猫]]</td>
+<span style="margin-right: 8px;">&#x1F5FA;</span>精简导航
-<td style="width:25%;padding:12px 15px;border:1px solid #ddd;text-align:center;vertical-align:middle;">
+</div>
-* [[LexBurner]]</td>
-<td style="width:25%;padding:12px 15px;border:1px solid #ddd;text-align:center;vertical-align:middle;">
+  <!-- 主内容区：使用 Flexbox 模拟网格 -->
-* [[千早爱音]]
+  <div style="
-* [[丰川祥子]]
+    display: flex;
-* [[长崎素世]]</td>
+    flex-wrap: wrap;
-</tr>
+    background-color: var(--color-surface-0, #ffffff);
-<tr>
+  ">
-<td colspan="4" style="padding:12px 15px;border:1px solid #ddd;text-align:right;vertical-align:middle;border-bottom-left-radius:16px;border-bottom-right-radius:16px;">[[{{PAGENAME}}/完整导航|查看完整导航 →]]</td>
-</tr>
+    <!-- 栏目1：动物园 -->
-</table>
+    <div style="
+      flex: 1 1 280px;
+      padding: 16px 20px;
+      border-bottom: 1px solid var(--border-color-subtle, #eaecf0);
+      border-right: 1px solid var(--border-color-subtle, #eaecf0);
+      border-left: 5px solid #4CAF50;
+      box-sizing: border-box;
+    ">
+      <div style="
+        font-weight: 700;
+        margin-bottom: 12px;
+        color: var(--color-base, #202122);
+        font-size: 1.05em;
+        padding-bottom: 6px;
+        border-bottom: 1px solid var(--border-color-subtle, #eee);
+      ">
+[[导航:泛ACG亚文化百科/动物园文化＆吉吉国文化|&#x267f; 动物园 & 吉吉国]]
+</div>
+<div style="line-height: 1.8; font-size: 0.95em;">
+        <div style="display:flex; align-items:center;">
+<span style="display:inline-block; width:8px; height:8px; background:#2196F3; margin-right:8px; flex-shrink:0;"></span>
+[[导航:泛ACG亚文化百科/动物园文化＆吉吉国文化/电棍otto|电棍otto]]
+        </div>
+        <div style="display:flex; align-items:center;">
+<span style="display:inline-block; width:8px; height:8px; background:#d32f2f; margin-right:8px; flex-shrink:0;"></span>
+[[导航:泛ACG亚文化百科/动物园文化＆吉吉国文化/山泥若|山泥若]]
+</div>
+<div style="display:flex; align-items:center;">
+<span style="display:inline-block; width:8px; height:8px; background:#e6ac23; margin-right:8px; flex-shrink:0;"></span>
+[[导航:泛ACG亚文化百科/动物园文化＆吉吉国文化/炫神|炫神]]
+</div>
+<div style="margin-top:6px; font-weight:600; font-size:0.9em; opacity:0.8;">
+[[导航:泛ACG亚文化百科/动物园文化＆吉吉国文化/重要人物＆重要团体|→ 更多动物园人物 ↓下滑其它]]
+</div>
+</div>
+</div>
+    <!-- 栏目2：蕾忍宗 -->
+    <div style="
+      flex: 1 1 280px;
+      padding: 16px 20px;
+      border-bottom: 1px solid var(--border-color-subtle, #eaecf0);
+      border-right: 1px solid var(--border-color-subtle, #eaecf0);
+      border-left: 5px solid #757575;
+      box-sizing: border-box;
+    ">
+      <div style="
+        font-weight: 700;
+        margin-bottom: 12px;
+        color: var(--color-base, #202122);
+        font-size: 1.05em;
+        padding-bottom: 6px;
+        border-bottom: 1px solid var(--border-color-subtle, #eee);
+      ">
+[[导航:泛ACG亚文化百科/蕾忍宗|&#x1F977; 蕾忍宗]]
+      </div>
+      <div style="line-height: 1.8; font-size: 0.95em;">
+<div>&#x1F539; [[忍者]]</div>
+<div>&#x1F539; [[安奈师傅]]</div>
+<div>&#x1F539; [[叛忍999]]</div>
+        <div style="visibility:hidden;">.</div>
+      </div>
+    </div>
+    <!-- 栏目3：豌豆笑传 -->
+    <div style="
+      flex: 1 1 280px;
+      padding: 16px 20px;
+      border-bottom: 1px solid var(--border-color-subtle, #eaecf0);
+      border-left: 5px solid #ef6c00;
+      box-sizing: border-box;
+    ">
+      <div style="
+        font-weight: 700;
+        margin-bottom: 12px;
+        color: var(--color-base, #202122);
+        font-size: 1.05em;
+        padding-bottom: 6px;
+        border-bottom: 1px solid var(--border-color-subtle, #eee);
+      ">
+[[导航:泛ACG亚文化百科/豌豆笑传|&#x1F418; 豌豆笑传]]
+      </div>
+      <div style="line-height: 1.8; font-size: 0.95em;">
+<div>&#x1F539; [[袁伟江]]</div>
+<div>&#x1F539; [[栗瑞明]]</div>
+<div>&#x1F539; [[豌豆]]</div>
+<div>&#x1F539; [[大蓝象]] / [[踩踩背]]</div>
+      </div>
+    </div>
+  </div>
+  <!-- 底部区域 -->
+<div style="
+    padding: 12px;
+    background-color: var(--color-surface-1, #f8f9fa); /* 浅灰背景，深色模式下会变深灰 */
+    text-align: right;
+    border-top: 1px solid var(--border-color-base, #a2a9b1);
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    gap: 10px;
+  ">
+<span>需要查找更多内容？</span>
+{{CustomButton|泛ACG亚文化百科|查看完整导航 →|class=mw-ui-progressive}}
+  </div>
+</div>
+[[分类:首页模板]]

棍牧典​（留言 | 贡献）

2026年1月8日 (四) 20:00的最新版本

棍牧典（留言 | 贡献）