打印CSS - 避免削减DIV

Question

我正在开发一个生成条形码的应用程序,我想要打印它们但条形码div在某些页面中被切割.

CSS:

<style type="text/css">
    * {
        margin:0px;
    }
    #cod {
        width: 180px;
        height: 150px;
        padding: 10px;
        margin: 10px;
        float: left;
        border: solid black 1px;
        text-align: center;
        display: block;
    }

</style>

码:

<? foreach ($this->ouvintes as $ouvinte): ?>
    <div id="cod">
        <p><?= $ouvinte->nome ?></p>
        <p><?= $ouvinte->instituicao ?></p>
        <p>Cod. Barras: <?= $ouvinte->codigo_barras ?></p>
        <p style="margin-top:5px;"><img src="<?= $this->baseUrl('/index/codigo-barras/code/' . $ouvinte->codigo_barras) ?>" alt="<?= $ouvinte->codigo_barras ?>" /></p>
    </div>
<? endforeach; ?>

有谁知道我怎么能避免这种削减？

谢谢

Answer 1

如何尝试page-break-after/ page-break-beforeCSS属性？

您可以将其设置为每隔9个条形码后断开:

<? 
$i = 0;
foreach ($this->ouvintes as $ouvinte):
    $i++;
    $pageBreakStyle = ($i % 9 == 0) ? ' style="page-break-after:always"' : '';
?>
    <div id="cod"<?= $pageBreakStyle ?>>
        <p><?= $ouvinte->nome ?></p>
        <p><?= $ouvinte->instituicao ?></p>
        <p>Cod. Barras: <?= $ouvinte->codigo_barras ?></p>
        <p style="margin-top:5px;"><img src="<?= $this->baseUrl('/index/codigo-barras/code/' . $ouvinte->codigo_barras) ?>" alt="<?= $ouvinte->codigo_barras ?>" /></p>
    </div>
<? endforeach; ?>