Question

可能重复：
Progress bar layout using CSS and HTML

我正在制作一个涉及能量，EXP，等级，任务等的游戏。好吧，当你执行任务时，它会消耗能量，一旦你完成任务就会收到现金和EXP。好吧，它需要EXP才能升级。升级工作，但我想添加一个进度条来显示你有多接近升级。一个例子是Exp：26,175 / 27,100。每次你调平max_exp都会增加250，但是想要在文本后面留一个条来显示它们有多接近升级而不是仅仅看到文本。这是下面的调平编码..

<?php
if ($exp >= $max_exp)
    {
    $sql = "UPDATE users SET level=(level + 1) , max_exp=(max_exp + 250) WHERE id='".$id."' LIMIT 1";
    $res = mysql_query($sql);
if ($exp >= $max_exp)
        echo '';
    }
    else
    {
    } 
    ?>

Answer 1

您可以将您的比率回显为内联css。

一个例子：

的CSS：

div#value
{
    display: block; 
    z-index: 2;
    height: 10px;
}

的PHP / HTML：

$value = 35;

//this line will give you "width: 35%"
<div id="value" style="width:<?php echo $value; ?>%;">

Answer 2

这只是一个HTML / CSS问题：创建一个只有一行和两列的表（比如一个全绿，一个白色），然后根据你的值移动两列的宽度比

PHP MySql进度条

2 个答案: