Barryvdh \ DomPDF如何在一张桌子内打破页面

时间:2016-09-18 09:26:08

标签: php laravel dompdf

我使用Barryvdh \ DomPDF从一个" laravel"创建我的pdf视图。

我想在每个页面上获得相同的标题。为此,我的代码是:

    <!DOCTYPE html>
<html lang="fr">
    <head>
        <meta charset="utf-8">
        <title>Liste des personnes</title>
        <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
        <style>
        .header,
        .footer {
        width: 100%;
        text-align: center;
        position: fixed;
        }
        .header {
        top: 0px;
        }
        .footer {
        bottom: 0px;
        }
        .pagenum:before {
        content: counter(page);
        }

        </style>
    </head>
    <body>

        {{-- -------------------------------------------------------- --}}
        {{-- pour ajouter une entete et un pied de page au pdf généré --}}
        {{-- -------------------------------------------------------- --}}

        <div class="header">
            <h2>Liste des personnes</h2>
            <hr>    
        </div>
        <div class="footer">
            Page <span class="pagenum"></span>
        </div>
        <div style="page-break-after:always;">

        <table class="table table-striped" style="margin-top:30mm">
            <tbody>

                @foreach($liste_personnes as $personne)

                <tr>
                    <td class="text-center">
                        <img style="height: 100px"  src="{{ asset($personne->nom_photo_vignette) }}" alt="pas de photo">
                    </td>
                    <td>
                        <strong>{{ $personne->nom.' '.$personne->prenom }}</strong><br>
                        {{ $personne->adresse1 }}<br>
                        {{ $personne->code_postal.' '.$personne->commune }}
                    </td>
                    <td>
                        né(e) le {{ $personne->date_naissance_dmY }}<br>
                        {{ $personne->libelle_role }}
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>
        </div>
    </body>
</html>

但结果是这一个:

enter image description here

正如您所看到的,页眉和页脚在第1页上没问题。但不适用于下一页。

如何为每个新页面上的每个新第一行添加一些空格?

感谢您的帮助。留言Merci DOM

1 个答案:

答案 0 :(得分:2)

像那样解决:

    <!DOCTYPE html>
<html lang="fr">
    <head>
        <meta charset="utf-8">
        <title>Liste des personnes</title>
        <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
        <style>
        @page { margin: 100px 50px; }
        .header { position: fixed; left: 0px; top: -100px; right: 0px; height: 100px; text-align: center; }
        .footer { position: fixed; left: 0px; bottom: -50px; right: 0px; height: 50px;text-align: center;}
        .footer .pagenum:before { content: counter(page); }
        </style>

    </head>
    <body>
        {{-- -------------------------------------------------------- --}}
        {{-- pour ajouter une entete et un pied de page au pdf généré --}}
        {{-- -------------------------------------------------------- --}}
        <div class="header">
            <h2>Liste des personnes</h2>
        </div>
        <div class="footer">

            Page <span class="pagenum"></span>
        </div>

        <table class="table table-striped">
            <tbody>

                @foreach($liste_personnes as $personne)

                <tr>
                    <td class="text-center">
                        <img style="height: 80px"  src="{{ asset($personne->nom_photo_vignette) }}" alt="pas de photo">
                    </td>
                    <td>
                        <strong>{{ $personne->nom.' '.$personne->prenom }}</strong><br>
                        {{ $personne->adresse1 }}<br>
                        {{ $personne->code_postal.' '.$personne->commune }}
                    </td>
                    <td>
                        né(e) le {{ $personne->date_naissance_dmY }}<br>
                        {{ $personne->libelle_role }}
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>

    </body>
</html>

enter image description here

希望它能帮助其他人。 DOM