2015-12-16 120 views
0

我有我的模板,它的大部分工作,有两件事是错误的。我希望进度栏对齐页面左侧,我也希望显示百分比。Mediawiki模板选项

<div style=" 
width:{{{width|25%}}}; 
{{#ifeq: {{{center|yes}}} | yes | 
margin:auto; 
text-align:center;}}"> 
{{#ifeq: {{{header|yes}}} | yes 
| <p> 
{{{text|completed <small>(estimate)</small>}}} 
</p> 
}} 
<p style="border:{{{border|1px solid gray}}}; padding:{{{padding|1px}}}; overflow:hidden;"> 
<span style=" 
width: {{#expr: {{{1|<noinclude>2</noinclude>0}}}/{{{total|100}}} * 100}}%; 
height: {{{height|2}}}px; 
background:{{{color1|#5FDB00}}}; 
float:left;">&nbsp;</span> 
<span style=" 
width:{{#expr: 100 - {{{1|<noinclude>2</noinclude>0}}}/{{{total|100}}} * 100}}%; 
height:{{{height|2}}}px; 
background:{{{color2|#efefef}}}; 
float:left; 
">&nbsp;</span> 
</p> 
</div> 

我的例子

{{Progress bar|90|text=KTG Image Rebuild}} 

在这个例子中,任务是完成了90%,但上或进度条上,这并不显示。

+0

可能包含此输出的HTML有帮助。你在哪里期待“90%”出现? – miken32

+0

我发布的是模板代码。我在想,我需要添加另一个选项来进度条或以某种方式使用CSS – user770022

+0

但结果HTML的样子是什么? – miken32

回答

1

试试看。你实际上并没有试图把进度文本放进去,不确定你为什么期望它在那里。它在进度条<p>之上添加为div

<div style="float:left; width:{{{width|25%}}}; {{#ifeq: {{{center|yes}}} | yes | margin:auto; text-align:center;}}"> 
{{#ifeq: {{{header|yes}}} | yes | <p> 
{{{text|completed <small>(estimate)</small>}}} 
</p> 
}} 
<div style="float:right; text-align:right; font-size:10px; line-height:10px;">{{{1|20}}}%</div> 
<p style="border:{{{border|1px solid gray}}}; padding:{{{padding|1px}}}; overflow:hidden; float:left; width:80%"> 
<span style="width:{{#expr: {{{1|20}}}/{{{total|100}}} * 100}}%; height:{{{height|2}}}px; background:{{{color1|#5FDB00}}}; float:left;">&nbsp;</span> 
<span style="width:{{#expr: 100 - {{{1|20}}}/{{{total|100}}} * 100}}%; height:{{{height|2}}}px; background:{{{color2|#efefef}}}; float:left;">&nbsp;</span> 
</p> 
</div>