模板:Y tabbar：修订间差异

2025年4月7日 (一) 15:22的最新版本

中文

日文

主动技能

被动技能

特殊技能

必杀技&EX技能

@@ 第1行： / 第1行： @@
      <div class="y_tabbar">
          <div class="first-level-tabs">
-             <div id="chinese-tab">中文</div>
+             <div class="tab-btn" id="chinese-tab">中文</div>
-             <div id="japanese-tab">日文</div>
+             <div class="tab-btn" id="japanese-tab">日文</div>
          </div>
          <div id="chinese" class="second-level-container">
              <div class="second-level-tabs">
-                 <div id="chinese-active-tab">主动技能</div>
+                 <div class="tab-btn" id="chinese-active-tab">主动技能</div>
-                 <div id="chinese-passive-tab">被动技能</div>
+                 <div class="tab-btn" id="chinese-passive-tab">被动技能</div>
-                 <div id="chinese-special-tab">特殊技能</div>
+                 <div class="tab-btn" id="chinese-special-tab">特殊技能</div>
-                 <div id="chinese-ultimate-tab">必杀技&EX技能</div>
+                 <div class="tab-btn" id="chinese-ultimate-tab">必杀技&EX技能</div>
              </div>
              <div id="chinese-active" class="content">
-{{#invoke:角色技能|角色技能|角色序号= 10 |查询类型=主动|查询语言=中文}}
+                {{#invoke:角色技能|角色技能|角色序号={{#var:角色序号}}|查询类型=主动|查询语言=中文}}
-</div>
+            </div>
              <div id="chinese-passive" class="content" style="display: none;">
-{{#invoke:角色技能|角色技能|角色序号= 10 |查询类型=被动|查询语言=中文}}
+                {{#invoke:角色技能|角色技能|角色序号={{#var:角色序号}}|查询类型=被动|查询语言=中文}}
-</div>
+            </div>
              <div id="chinese-special" class="content" style="display: none;">
-{{#invoke:角色技能|角色技能|角色序号= 10 |查询类型=特殊|查询语言=中文}}
+                {{#invoke:角色技能|角色技能|角色序号={{#var:角色序号}}|查询类型=特殊|查询语言=中文}}
-</div>
+            </div>
              <div id="chinese-ultimate" class="content" style="display: none;">
-{{#invoke:角色技能|角色技能|角色序号= 10 |查询类型=EX|查询语言=中文}}
+                {{#invoke:角色技能|角色技能|角色序号={{#var:角色序号}}|查询类型=EX|查询语言=中文}}
-</div>
+            </div>
          </div>
          <div id="japanese" class="second-level-container" style="display: none;">
              <div class="second-level-tabs">
-                 <div id="japanese-active-tab">主动技能</div>
+                 <div class="tab-btn" id="japanese-active-tab">主动技能</div>
-                 <div id="japanese-passive-tab">被动技能</div>
+                 <div class="tab-btn" id="japanese-passive-tab">被动技能</div>
-                 <div id="japanese-special-tab">特殊技能</div>
+                 <div class="tab-btn" id="japanese-special-tab">特殊技能</div>
-                 <div id="japanese-ultimate-tab">必杀技&EX技能</div>
+                 <div class="tab-btn" id="japanese-ultimate-tab">必杀技&EX技能</div>
              </div>
              <div id="japanese-active" class="content">
-{{#invoke:角色技能|角色技能|角色序号={{#var:角色序号}}|查询类型=主动|查询语言=日文}}
+                {{#invoke:角色技能|角色技能|角色序号={{#var:角色序号}}|查询类型=主动|查询语言=日文}}
-</div>
+            </div>
              <div id="japanese-passive" class="content" style="display: none;">
-{{#invoke:角色技能|角色技能|角色序号={{#var:角色序号}}|查询类型=被动|查询语言=日文}}
+                {{#invoke:角色技能|角色技能|角色序号={{#var:角色序号}}|查询类型=被动|查询语言=日文}}
-</div>
+            </div>
              <div id="japanese-special" class="content" style="display: none;">
-{{#invoke:角色技能|角色技能|角色序号={{#var:角色序号}}|查询类型=特殊|查询语言=日文}}
+                {{#invoke:角色技能|角色技能|角色序号={{#var:角色序号}}|查询类型=特殊|查询语言=日文}}
-</div>
+            </div>
              <div id="japanese-ultimate" class="content" style="display: none;">
-{{#invoke:角色技能|角色技能|角色序号={{#var:角色序号}}|查询类型=EX|查询语言=日文}}
+                {{#invoke:角色技能|角色技能|角色序号={{#var:角色序号}}|查询类型=EX|查询语言=日文}}
-</div>
+            </div>
          </div>
+    </div>
-{{#css:
-        .y_tabbar {
-            font-family: Arial, sans-serif;
-            margin: 0;
-            padding: 20px;
-            background-color: transparent;
-        }
-        .y_tabbar .first-level-tabs, .y_tabbar .second-level-tabs {
-            display: flex;
-            flex-direction: row;
-            background-color: transparent;
-            border: none;
-            border-radius: 5px;
-            margin-bottom: 0;
-        }
-        .y_tabbar .first-level-tabs div, .y_tabbar .second-level-tabs div {
-            padding: 10px 20px;
-            cursor: pointer;
-            border-right: none;
-        }
-        .y_tabbar .first-level-tabs div:last-child, .y_tabbar .second-level-tabs div:last-child {
-            border-right: none;
-        }
-        .y_tabbar .first-level-tabs div:hover, .y_tabbar .second-level-tabs div:hover {
-            background-color: #e0e0e0;
-        }
-        .y_tabbar .first-level-tabs div.active, .y_tabbar .second-level-tabs div.active {
-            background-color: #e0e0e0;
-            color: #0000ff;
-            text-decoration: underline;
-        }
-        .y_tabbar .second-level-container {
-            background-color: transparent;
-            border: none;
-            border-radius: 5px;
-            padding: 0;
-            margin-left: 0;
-        }
-        .y_tabbar .content {
-            margin-top: 0;
-            text-align: left;
-        }
-        /* 添加选中效果样式 */
-        .y_tabbar .selected {
-            color: #0000ff;
-            text-decoration: underline;
-        }
-.skillbox {
-    color: black;
-    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px 0px;
-    width: 100%;
-    background-color: rgb(251, 249, 241);
-    border-radius: 0.5em;
-    margin: 12px 0px;
-    padding: 8px 8px;
-}
-.skillbox {
-    display: flex;
-    flex-direction: row;
-    justify-content: flex-start;
-}
-.skillbox-left {
-    display: flex;
-    flex-direction: column;
-    justify-content: flex-start;
-    margin: 5px;
-    align-items: center;
-}
-.skillbox-name {
-    font-size: 1.35em;
-    line-height: 1;
-    font-weight: bold;
-}
-.skillbox-right {
-    width: 100%;
-}
-.skillbox-topbox {
-    display: flex;
-    width: 100%;
-    justify-content: space-between;
-}
-.skillbox-namebox {
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-}
-.skillbox-sp {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    border: 1px solid #d0bca7;
-    background-color: #d0bca7;
-    border-radius: 0.5em;
-    padding: 0 15px;
-}
-.skillbox-tag{
-    width: 25px;
-   height:auto;
-}
-.skillbox-tag2{
-    width: 30px;
-   height:auto;
-}
-.parent-description-container {
-    padding-left: 2em;
-}
-@media(min-width:720px){
-.skillbox-content tr td:first-child {
-    width: 15%;
-}
-}
-}}
 {{ResourceLoader|MediaWiki:Y_tabbar.js|isModuleES6=true}}