php - 如何使内容适合表格大小

Question

我正在寻找一种使表格内容适合表格大小的方法。 例如，我有一个宽度和高度 = 100、5 列和 5 行的表格，如果行或列更改为 20，则仅内容会重新调整大小以适应旧表格大小。 我写了一些代码， 但如果行或列发生变化，它会调整表的大小!

<style>
.tbl {
    max-width: 100px;
    max-height: 100px;
    height: 100px;
    width: 100px;
    border: 1px solid #333;
}
.blck {
    border: 1px solid #0F3;
    background:#F00;    
}
.wht {
    border: 1px solid #0F3;
    background:#069;
}
</style>
<?php
$w = 15;
$h = 15;
$max = 100;

if ($w>=$h) {
    $cell = ($max/$w);
} else {
    $cell = ($max/$h);
}
$clr = 0;
$tbl .= '<table width="'.$max.'px" align="center" border="0" height="'.$max.'px" class="tbl">';
for ($r=1;$r<=$h;$r++){

$tbl .= '<tr>';
    for($c=1;$c<=$w;$c++){
        if($clr == '0'){
            $tbl .= '<td width="'.$cell.'%" height="'.$cell.'%" class="blck"></td>';
            $clr = 1;
        } else {
            $tbl .= '<td width="'.$cell.'%" height="'.$cell.'%" class="wht"></td>';
            $clr = 0;
        }
    }
$tbl .= '</tr>';
}

$tbl .= '</table>';

echo $tbl;

?>

Answer 1

为表格单元格添加边框时要小心，因为它会将当前宽度/高度增加 2px。 当您将表格宽度除以列数/行数时使用 floor()，因为宽度和高度属性不接受分数。

而且高度属性似乎不准确(不知道为什么)。

您还必须考虑文本大小。例如我把:

font-size: 1px;
line-height: 1px;

检查一下:

<?php
$w = 30;
$h = 30;
$max = 100;

if ($w>=$h) {
    $cell = floor($max/$w);
} else {
    $cell = floor($max/$h);
}
?>
<style type="text/css">
.tbl {
    display: table;
    height: <?php echo ($cell*$h); ?>px;
    width: <?php echo ($cell*$w); ?>px;
    font-size: 1px;
    line-height: 1px;
}
.blck {
    background-color: #F00;
}
.wht {
    background-color: #069;
}

.tbl .tr {
    display: table-row;
}

.tbl .td {
    width: <?php echo $cell;?>px;
    height: <?php echo $cell;?>px;
    display: table-cell;
}
</style>
<?php 

$fcell = $clr = 0;
$tbl .= '<div class="tbl">';
for ($r=1;$r<=$h;$r++){
    $tbl .= '<div class="tr">';
        for($c=1;$c<=$w;$c++){
            if($clr == '0'){
                $tbl .= '<div class="td blck">&nbsp;</div>';
                $clr = 1;
            } else {
                $tbl .= '<div class="td wht">&nbsp;</div>';
                $clr = 0;
            }
        }
    $tbl .= '</div>';

    if ($fcell == 0){
        $fcell = $clr = 1;
    } else {
        $fcell = $clr = 0;
    }
}

$tbl .= '</div>';

echo $tbl;

?>