动态增加for循环中css元素的宽度

Question

编辑：我发现了，它在我的下面的其他答案。

我想在php中展示一个图表并且可以创建列，但是当我尝试增加与.inner类的css宽度相对应的百分比时，它不会为数组中的每个元素增加。如何增加数组中每个元素的宽度？

$percentage = array(0.2,0.4,0.5,0.6,0.7,0.8); 

for($i=0;$i<6;$i++){ 

echo "<div class='outter'> 
<div class='inner'>"; echo $percentage[$i]; echo " 
</div> 
</div>"; 

echo "<style type='text/css'>"; 
echo ".outter{height:25px;width:500%;border-right:solid 1px #000;}"; 
echo ".inner{height:25px;width:";echo $percentage[i]; echo "%;border-right:solid 1px #000;background-color:#02abff;}"; 
echo "</style>"; 

} 

我可以在HTML和CSS中做到这一点，但我想做的PHP。谢谢。

Answer 1

不知道您是否注意到了，但您在那里的实际值是0.X%，并且这不完全是有效宽度。您可能需要将该值乘以10（或100）以达到2％（或20％）。

$percentage = array(0.2,0.4,0.5,0.6,0.7,0.8); 

foreach ($percentage as $key => $val) { 
    echo "<div class='outter'> 
     <div class='inner'>"; 
    echo $val; 
    echo "</div> 
     </div>"; 

    echo "<style type='text/css'>"; 
    echo ".outter{height:25px;width:500%;border-right:solid 1px #000;}"; 
    echo ".inner{height:25px;width:"; 
    echo $val * 10; 
    echo "%;border-right:solid 1px #000;background-color:#02abff;}"; 
    echo "</style>"; 
} 

我也改变了for环，你有没有到foreach循环，这使得更多的意义时working with arrays。

Answer 2

我找到了。我不得不把样式放在html标签中：

foreach($percentage as $percent){ 

echo "<div class='outter' style='height:25px;width:500%;border-right:solid 1px #000;'> 
<div class='inner' style='height:25px;width:"; echo $percent; echo "%;border-right:solid 1px #000;background-color:#02abff;'>"; echo $percent; echo " 
</div> 
</div>"; 
}