Spatie Browsershot和信头纸/ CSS

Question

我正在尝试使用spatie/browsershot和laravel-browsershot wrapper在Laravel应用程序中生成包含视图内容的PDF；我正在使用svg作为信笺背景，并希望将视图的内容放置在每页SVG的特定区域内。不幸的是，边距->margins(40, 20, 40, 30)使我的#watermark div随着边距移动-它不再处于固定的0,0位置。您能帮我正确设置水印div吗？因此它不受页边距的影响

在控制器中

 return PDF::loadView('pdf.letter', compact('letter'))
            ->showBackground()
            ->waitUntilNetworkIdle()
            ->margins(40, 20, 40, 30)
            ->format('A4')
            ->inline();

在刀片中，我根据CSS进行设置

#watermark { 
 position: fixed;
 top: 0px;
 left: 0px;
 width: 21cm;
 height: 29.7cm;
 z-index: -1000;
}

<body>
    <div id="watermark">
        <img src="{{ asset('/img/a4.svg') }}" height="100%" width="100%" />
    </div>
    <div>
        <!-- The content of PDF here -->
    </div>
</body>

我最大的成就是这个

其中虚线矩形是SVG文件中的一个区域，我希望视图的所有内容都可以流入所有页面，并遵守设置的边距

我通过删除php中的->margins(....)并将样式添加到<body>标签中实现了

body {
 margin-top: 4cm;
 margin-right: 2cm;
 margin-bottom: 4cm;
 margin-left: 3cm;
}

如您所见，页面的页边距在第一页的底部和下一页的顶部似乎为0

Answer 1

尝试以下操作：

Custom Header and Footer - https://github.com/spatie/browsershot/issues/186

和

Handle page breaks - https://github.com/spatie/browsershot/issues/333

Spatie Browsershot和信头纸/ CSS

问题描述投票：0回答：1

1个回答

最新问题

Spatie Browsershot和信头纸/ CSS

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1