模板:切换标签面板/文档

使用方法

{{切换标签面板|标签开始|标签样式= }}
{{切换标签面板|标签名称|标签名称= |标签样式= }}
{{切换标签面板|标签名称|标签名称= |标签样式= }}
{{切换标签面板|标签结束}}
{{切换标签面板|首个内容开始|标签内容样式= |标签序号= }}<!-- 默认标签序号为1 -->
<!-- 此处输入你需要显示的内容 -->
{{切换标签面板|首个内容结束}}
{{切换标签面板|次个内容开始|标签内容样式= |标签序号= }}<!-- 默认标签序号为2，同一页面不能有相同的序号 -->
<!-- 此处输入你需要显示的内容 -->
{{切换标签面板|次个内容结束}}
{{切换标签面板|标签结束}}

应用实例：简易版（+居左显示）

将标签样式里的justify-content设置为“left”即可，并且无需区分首个和次个内容，无需标签序号

{{切换标签面板|标签开始|标签样式=justify-content:left;background-color: rgba(32, 33, 34, 0.8);box-shadow: 0px 0px 4px 1px rgba(0, 0, 0,0.75);}}
{{切换标签面板|标签名称|标签名称=标签1}}
{{切换标签面板|标签名称|标签名称=标签2}}
{{切换标签面板|标签名称|标签名称=标签3}}
{{切换标签面板|标签结束}}{{切换标签面板|内容开始}}
内容1
{{切换标签面板|内容结束}}{{切换标签面板|内容开始}}
内容2
{{切换标签面板|内容结束}}{{切换标签面板|内容开始}}
内容3
{{切换标签面板|内容结束}}{{切换标签面板|标签结束}}

标签1

标签2

标签3

内容1

内容2

内容3

应用实例：居中显示

{{切换标签面板|标签开始|标签样式=justify-content:center;background-color: rgba(32, 33, 34, 0.8);box-shadow: 0px 0px 4px 1px rgba(0, 0, 0,0.75);}}
{{切换标签面板|标签名称|标签名称=标签1|标签样式= }}
{{切换标签面板|标签名称|标签名称=标签2|标签样式= }}
{{切换标签面板|标签名称|标签名称=标签3|标签样式= }}
{{切换标签面板|标签结束}}
{{切换标签面板|首个内容开始|标签内容样式= |标签序号=1}}<!-- 默认标签序号为1 -->
内容1
{{切换标签面板|首个内容结束}}
{{切换标签面板|次个内容开始|标签内容样式= |标签序号=2}}<!-- 默认标签序号为2，同一页面不能有相同的序号 -->
内容2
{{切换标签面板|次个内容结束}}
{{切换标签面板|次个内容开始|标签内容样式= |标签序号=3}}
内容3
{{切换标签面板|次个内容结束}}
{{切换标签面板|标签结束}}

标签1

标签2

标签3

内容1

内容2

内容3

应用实例：居左显示

将标签样式里的justify-content设置为“left”即可

{{切换标签面板|标签开始|标签样式=justify-content:left;background-color: rgba(32, 33, 34, 0.8);box-shadow: 0px 0px 4px 1px rgba(0, 0, 0,0.75);}}
{{切换标签面板|标签名称|标签名称=标签1|标签样式= }}
{{切换标签面板|标签名称|标签名称=标签2|标签样式= }}
{{切换标签面板|标签名称|标签名称=标签3|标签样式= }}
{{切换标签面板|标签结束}}
{{切换标签面板|首个内容开始|标签内容样式= |标签序号=1}}<!-- 默认标签序号为1 -->
内容1
{{切换标签面板|首个内容结束}}
{{切换标签面板|次个内容开始|标签内容样式= |标签序号=2}}<!-- 默认标签序号为2，同一页面不能有相同的序号 -->
内容2
{{切换标签面板|次个内容结束}}
{{切换标签面板|次个内容开始|标签内容样式= |标签序号=3}}
内容3
{{切换标签面板|次个内容结束}}
{{切换标签面板|标签结束}}

标签1

标签2

标签3

内容1

内容2

内容3

测试能否跨行

标签1

标签2

标签3

标签12

标签13

标签22

标签23

标签32

标签33

标签122

标签123

标签132

标签133

内容1111

内容2222

内容3333

内容2A

内容3A

内容2S

内容3S

内容2D

内容3D

内容2F

内容3F

内容2G

内容3G