Tools 是非官方社区Wiki。社区文档正在编写中,欢迎参与。 Wiki编辑答疑群:717421103
版本250722.2
全站通知:

模板:导航

来自WIKI实验室WIKI_BWIKI_哔哩哔哩
跳到导航 跳到搜索

用途

简约导航

用于在页面中插入「分组标题 + 多项链接」的紧凑导航区块。

特点:支持最小列宽的网格排布(CSS Grid)、标题列宽可调、整体宽度可控、一次调用可渲染多组。

版本:1.2


使用

基本用法(第1参数为总标题;其后以「标题-」前缀传入多组内容):

{{导航|[[帮助:导航|帮助导航]]
|标题-项目=
* [[首页]]
* [[首页]]
|标题-管理与[[开发]]=
* [[首页]]
* [[首页]]
|标题-[[编辑帮助]]=
* [[首页]]
* [[首页]]
* [[首页]]
}}

可选参数:

  • width:整体宽度,便于居中控制。
  • k-width:左侧分组标题的最小宽度(默认 10em)。
  • v-width:右侧网格中每个 li 的最小宽度(默认 6em)。

示例:限制整体宽度、保持居中

{{导航|width=500px|[[首页|帮助导航]]
|标题-项目=
* [[首页]]
* [[首页]]
|标题-管理与[[开发]]=
* [[首页]]
* [[首页]]
|标题-[[编辑帮助]]=
* [[首页]]
* [[首页]]
* [[首页]]
}}

示例:调整标题列宽与每项最小宽度

{{导航|width=600px|k-width=12em|v-width=4em|[[首页|帮助导航]]
|标题-[[武器]]=
* [[刀]]
* [[枪]]
* [[斧]]
* [[弓]]
* [[法杖]]
* [[盾牌]]
|标题-[[卷轴]]=
* [[治疗卷轴]]
* [[复活卷轴]]
* [[传送卷轴]]
}}

说明

  • 每个「标题-…」会生成一行:左侧为分组标题(受 k-width 控制),右侧为网格列表(受 v-width 控制)。
  • 右侧列表使用 CSS Grid:grid-template-columns: repeat(auto-fill, minmax(v-width, 1fr)); 自动换行与均分。

依赖页面

<div class="nano-nav-box " data-item-width="6em" style="width:auto;"><div class="n-nav-lines" style="max-width:100%"></div> </div>


标签

标签:导航


更新日志

  • 1.2:采用 CSS Grid 网格布局
  • 1.1:过渡为 Flex 布局,增加细节参数。
  • 1.0:发布。