php - 制作 PHP CSS 和 HTML 进度条

Question

我用 PHP、CSS 和 HTML 制作了一个进度条。好吧，它可以正常工作，但例如用户有 6/6 的耐力。该条将是 100% 的 6%。我将如何改变这个？这是下面的编码..

<div class="progress-outer">
    <div class="progress-inner" 
    style="width: <?php echo $energy ?>%;">Energy:<?php echo $energy . '/' . $max_energy ?></div>
    </div>​     

CSS是..

.progress-outer {
background: #000000;
height: 20px;
padding: 2px;
border: 1px solid #FFFFFF;
}

.progress-inner {
font-size: 16px;
color: #FFFFFF;
font-weight: bold;
background: #333333;
height: 100%;
}​

Answer 1

第一个<?php echo $energy ?>应该是<?php echo ($energy/$max_energy*100) ?>...

Answer 2

它会是这样的（我添加了一些视觉风格进行测试..你可以删除background-colors_

<?php
$max_energy = 100;
$energy = 6;
?>
<div class="progress-outer" style="border:1px solid black;background:#ff0000;width:100px">
    <div class="progress-inner" style="background:#0F0;width:<?php echo ($energy/$max_energy * 100); ?>px;">Energy:<?php echo $energy . '/' . $max_energy; ?></div>
</div>​

Answer 3

我完全不明白，但我猜他想创建一个基于两个数字百分比的进度条。

这是示例（我是在 javascript 中完成的，所以可见）： http ://codepen.io/anon/pen/hCIKD

所以php代码应该是这样的：

<?php
$current = 3;
$max = 6;
// (current / max) * 100% to obtain the percentage.
$percentage = ($current / $max) * 100;
echo "The percentage of ".$current." from ".$max." is ".$percentage;
?>

希望能帮助到你。