跳转到内容

Template:Progress bar text overlay/doc

维基百科,自由的百科全书

本模板可用于展示在正中央显示进度数字的进度条。

使用方法

[编辑]
{{PBTO|[进度]|[type=fraction]|[其他可选参数]}}

可选参数

[编辑]

数据类型

[编辑]
  • type:指定是否以分数形式显示。如果进度条的进度数字是分数(格式:分子 / 分母),请务必填入type=fraction,否则无法正确显示进度。(默认值为type=percentage
  • round:在指定type=fraction时,如需同时显示百分比,则使用此参数指定百分比小数点后的位数。小数点后末尾的0会保留。

布局

[编辑]
  • block:指定是否显示为块级元素,默认为否。如需显示为块级元素,请填入block=1
  • width:指定进度条的宽度,默认为400px。必须使用%empxpt之一为长度单位,否则会导致显示效果异常。
  • height:指定进度条的高度,默认为1.5em。必须使用empxpt之一为长度单位,否则会导致显示效果异常。
  • font_size:指定进度条数字的大小,默认为1em。必须使用empxpt之一为长度单位,否则会导致显示效果异常。

边框样式

[编辑]

以下各项中需要输入颜色的,可填写Extended color keywords中支持的颜色名或16进制值。

  • border:更改边框样式,包括边框宽度、类型和颜色。需满足CSS border shorthands中规定的格式。

颜色

[编辑]

以下各项中需要输入颜色的,可填写Extended color keywords中支持的颜色名或16进制值。

  • bg_color_incomplete:未完成部分的背景色。默认为透明(transparent)。
  • fg_color_incomplete:未完成部分的前景色。默认为black
  • bg_color_complete:已完成部分的背景色。默认为green
  • fg_color_complete:已完成部分的前景色。默认为white

用例

[编辑]

默认调用

[编辑]
{{PBTO}}

0% 0% 0%

设置进度

[编辑]
百分数进度:50%
{{PBTO|50%}}

50% 50% 50%

百分数进度:50.00%
{{PBTO|50.00%}}

50.00% 50.00% 50.00%

分数进度:2/4
{{PBTO|2/4|type=fraction}}

2/4 2/4 2/4

分数进度:2/4(显示百分比)
{{PBTO|2/4|type=fraction|round=0}}

2/4 (50%) 2/4 (50%) 2/4 (50%)

分数进度:2/4(百分比保留2位小数)
{{PBTO|2/4|type=fraction|round=2}}

2/4 (50.00%) 2/4 (50.00%) 2/4 (50.00%)

改变布局

[编辑]
显示为块状 对比效果:
未设置为块状
左边的内容{{PBTO|50%|width=80px}}右边的内容

左边的内容 50% 50% 50% 右边的内容

设置为块状
上一段的内容{{PBTO|50%|width=80px|block=1}}下一段的内容

上一段的内容 50% 50% 50% 下一段的内容

设置宽度
按长度
{{PBTO|50%|width=200px}}

50% 50% 50%

按百分比
{{PBTO|50%|width=60%}}

50% 50% 50%

设置高度
{{PBTO|50%|height=40px}}

50% 50% 50%

设置文字大小 注意:如以emfont_size参数的单位,则文字大小根据正文文字大小放缩确定。
{{PBTO|50%|height=3em|font_size=2em}}

50% 50% 50%

{{PBTO|50%|height=1.2em|font_size=0.8em}}

50% 50% 50%

改变边框样式

[编辑]
{{PBTO|50%|border=5px dotted red}}

50% 50% 50%

改变颜色

[编辑]
{{PBTO|50%
|bg_color_incomplete=khaki
|fg_color_incomplete=#F00
|bg_color_complete=purple
|fg_color_complete=#FFCD00
}}

50% 50% 50%

相关模板

[编辑]