2023年政策修订增补工作正在进行中,欢迎参与!
  • Moegirl.ICU:萌娘百科流亡社群 581077156(QQ),欢迎对萌娘百科运营感到失望的编辑者加入
  • Moegirl.ICU:账号认领正在试运行,有意者请参照账号认领流程

Template:菜单栏

萌娘百科,万物皆可萌的百科全书!转载请标注来源页面的网页链接,并声明引自萌娘百科。内容不可商用。
跳转到导航 跳转到搜索
Template-info.svg 模板文档  [查看] [编辑] [历史] [刷新]

构建一个菜单工具条。

参数

主要参数

本模板的参数格式可以采用定义ul相同,即*号。自动产生菜单。

{{菜单栏|
*菜单1
*菜单2
**菜单2-1
**菜单2-2
*菜单3
}}

将产生一个拥有3个菜单项,第二个菜单项拥有两个子项的菜单。其中,链接将在菜单项点击时触发。

#号与*号效果类似,但其中的[[参数1|参数2|参数3]]将被解释为{{折叠标签/高级|参数1(标签名)|参数2(默认文本)|参数3(激活文本)}}。同样,标签将在菜单项点击时触发折叠。

可选参数

  • 菜单
    • 菜单宽度width):默认为auto,指定为min-content,使菜单不再占满整行。
    • 菜单背景色back-color):默认为white
    • 菜单框架宽度border-width):默认为1px
    • 菜单框架色border-color):默认为green
    • 菜单开端宽度left-width):默认为15px
    • 菜单弹出方向pop-direction):指定一级菜单的弹出方向。默认为down。方向可选值为left right up down
    • 菜单项排列方向flex-direction):默认为rigth。方向可选值为left right up down
    • 菜单项分割线item-split):菜单项间默认存在框架同色分割线,指定为false取消。
  • 菜单项
    • 菜单项最小宽度item-min-width):默认为50px
    • 菜单项选择色select-color):默认为菜单框架色
    • 菜单项选择框架宽度select-border-width):默认为0。若不为零则使菜单悬停时显示框架而不是全部高亮。
    • 排列flex):默认为auto。产生菜单项填满菜单效果。
    • 菜单文字位置child-text-align):默认为center文字居中。可选left right
  • 子菜单
    • 子菜单背景色child-back-color):默认为菜单背景色
    • 子菜单框架宽度child-border-width):默认为菜单框架宽度
    • 子菜单框架色child-border-color):默认为菜单框架色
    • 子菜单展开方向child-flex-direction):默认为菜单弹出方向
    • 子菜单弹出方向child-pop-direction):指定多级菜单的弹出方向。默认为right
    • 子菜单项分割线item-split):子菜单项间默认存在框架同色分割线,指定为false取消。
  • 子菜单项
    • 子菜单项最小宽度item-min-width):
    • 子菜单项选择色child-select-color):默认为子菜单框架色
    • 子菜单项选择框架宽度child-select-back-color):默认为3px
    • 子菜单文字位置child-text-align):默认为菜单文字位置文字居中。

示例

直接使用

默认参数将得到一个萌百风格的菜单。

{{菜单栏|
*菜单1
*菜单2
**菜单2-1
**菜单2-2
***菜单2-2-1
*菜单3
}}
菜单1

菜单2
菜单2-1

菜单2-2
菜单2-2-1

菜单3

系统风格

{{菜单栏|菜单背景色=#F0F0F0|菜单框架色=#BEBEBE|菜单项选择色=blue|菜单宽度=min-content|子菜单项选择框架宽度=0|子菜单项选择色=blue|子菜单文字位置=left|
*文件(F)
**打开(O)
**保存(S)
**关闭(C)
*编辑(E)
*工具(T)
*帮助(H)
}}
文件(F)
打开(O)

保存(S)

关闭(C)

编辑(E)

工具(T)

帮助(H)

功能使用

{{菜单栏|
*[[这是一个链接]]
*这是一个菜单
**[[这是一个链接]]
##[[折叠|这是一个名字为“折叠”的折叠标签|点击后显示这样]]
**这是一个子菜单
###[[-非折叠|但本折叠名是“非折叠”而不是“-非折叠”|这个标签默认显示取反]]
***菜单能无限的循环下去
****这里就是尽头
#[[这是一个折叠标签]]
}}

这是一个菜单

这是一个名字为“折叠”的折叠标签
点击后显示这样
_

这是一个子菜单
但本折叠名是“非折叠”而不是“-非折叠”
这个标签默认显示取反
_

菜单能无限的循环下去
这里就是尽头

这是一个折叠标签
这是一个折叠标签
_


不同方向

向上

{{菜单栏|菜单弹出方向=up|
*项1
*项2
**项2-1
**项2-2
***项2-2-1
***项2-2-2
*项3
}}
项1

项2
项2-1

项2-2
项2-2-1

项2-2-2

项3

向右

{{菜单栏|菜单宽度=min-content|菜单项排列方向=down|菜单弹出方向=rigth|子菜单展开方向=down|
*项1
*项2
**项2-1
**项2-2
***项2-2-1
***项2-2-2
*项3
}}
项1

项2
项2-1

项2-2
项2-2-1

项2-2-2

项3

折叠菜单高级运用

使父菜单作为全选性折叠按钮。

{{菜单栏|
#[[RPG#ACT#SLG|单机游戏]]
##[[RPG]]
##[[ACT]]
##[[SLG]]
#网络游戏
#小游戏
}}
单机游戏
单机游戏
单机游戏
单机游戏
单机游戏
单机游戏
单机游戏
单机游戏
_
RPG
RPG
_

ACT
ACT
_

SLG
SLG
_

网络游戏

小游戏