Question

我做了一个百分比吧（只是一个简单的一个来得到这个想法）。我制作了一个CSS规则和一个简短的PHP代码块。由于某种原因，较大的条不会显示。然而，显示使用多少空间的较小的那个。我在这里缺少什么？

PHP：

$free = disk_free_space("F:");
$total = disk_total_space("F:");
$used = $total - $free;
$value = $used;
$max = $total;
$scale = 4.0;
if ( !empty($max) ) { $percent = ($value * 100) / $max; }
else { $percent = 0; }
if ( $percent > 100) { $percent = 100; }

CSS：

.percentbar {
background-color: #CCC;
border: solid 2px #000;
height:16px;
}
.percentbar div {
background-color: #F90;
height: 16px;
}

HTML：

<div class="percentbar" style="width:<?php echo round(100 * $scale); ?>px">
<div style="width:<?php echo round($percent * $scale); ?>px;">
</div>
</div>

正在显示辅助div，而不显示HTML中的第一个div。

Answer 1

~~我不认为你的问题是css。~~ 如果你为两个div设置相同的宽度，你就不会看到其中一个。

所以你必须确定你在宽度上打印的php值。如果它们对于两个div都相同或不正确，则第一个div可能显然没有显示

我刚刚测试过它与您所说的完全相同的值，它完美无缺。检查是否可以有另一个css覆盖此

Percent bar

Answer 2

$ percent可能始终具有小于100的值，因为$ value / $ max介于0和1之间，将其乘以100将始终小于100.较小的条可能仅位于较大条的顶部。

Answer 3

<style>
    .percentbar {
    background-color: #CCC;
    border: solid 2px #000;
    height:16px;
    }
    .percentbar div {
    background-color: #F90;
    height: 16px;
    }
</style>
<html>
<?php

$free = disk_free_space("F:");
$total = disk_total_space("F:");
$used = $total - $free;
$value = $used;
$max = $total;
$scale = 4.0;
if ( !empty($max) ) { $percent = ($value * 100) / $max; }
else { $percent = 0; }
if ( $percent > 100) { $percent = 100; }
?>

<div class="percentbar" style="width:<?php echo round(100 * $scale); ?>px">
<div style="width:<?php echo round($percent * $scale); ?>px;">
</div>
</div>

</html>

这个显示：

enter image description here

可能是你将php代码放在百分比div下，这就是为什么它不显示灰色条：

<style>
    .percentbar {
    background-color: #CCC;
    border: solid 2px #000;
    height:16px;
    }
    .percentbar div {
    background-color: #F90;
    height: 16px;
    }
</style>
<html>


<div class="percentbar" style="width:<?php echo round(100 * $scale); ?>px">
<div style="width:<?php echo round($percent * $scale); ?>px;">
</div>
</div>
<?php

$free = disk_free_space("F:");
$total = disk_total_space("F:");
$used = $total - $free;
$value = $used;
$max = $total;
$scale = 4.0;
if ( !empty($max) ) { $percent = ($value * 100) / $max; }
else { $percent = 0; }
if ( $percent > 100) { $percent = 100; }
?>
</html>

PHP和CSS百分比栏不显示div

3 个答案: