1

私はパーセンテージバーを作成しました（アイデアを得るための単純なものです）。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>

HTMLの最初のdivは表示されていませんが、補助divは表示されています。

4

3 に答える 3

1

あなたの問題はcssではないと思います。 両方の div に同じ幅を設定すると、そのうちの 1 つが表示されなくなります。

したがって、幅に印刷しているphp値について確認する必要があります。両方の div で同じか間違っている場合、最初の div が明らかに表示されていない可能性があります

あなたが言っているのとまったく同じ値で今テストしましたが、完全に機能します。これをオーバーライドする別の css があるかどうかを確認します

パーセントバー

于 2013-03-01T04:11:17.127 に答える
0

$value/$max は 0 と 1 の間にあり、100 を掛けると常に 100 未満になるため、$percent の値は常に 100 未満になる可能性があります。小さいバーが大きいバーの上にある可能性があります。

于 2013-03-01T04:08:42.893 に答える
0 
<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>

これは次のように表示されます。

ここに画像の説明を入力

灰色のバーが表示されない理由は、パーセントバー div の下に php コードを配置している可能性があります。

<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>
于 2013-03-01T05:04:15.410 に答える