跳至內容

模板: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%

相關模板

[編輯]