Arial 字体看起来从 HTML 到 mpdf 转换不同答案

【问题标题】：Arial font looks different from HTML to a mpdf conversionArial 字体看起来从 HTML 到 mpdf 转换不同
【发布时间】：2021-03-15 14:47:41
【问题描述】：

肯定有一些我不知道字体如何工作的东西，实际上有很多东西。可能有人可以解释一下为什么我的css中的字体设置为“font-family: Arial, Helvetica, sans-serif;”

为什么看起来有点不同？在 pdf 中看起来拉伸和圆润。同一种字体有不同的类型吗？如果是这种情况，我该如何解决？

HTML 页面：

PDF 页面：

这就是我应用到 html 以使用 mpdf 打印的内容

h1
{
text-align: center;
margin-top: 90px;
margin-bottom: 90px;
text-transform: uppercase;
font-family: Arial, Helvetica, sans-serif;
font-weight: normal;
font-size: 23vw;
}




$htmlStringView = view('pdf-view', ['content' => $content, 'cssString' => $cssString])->render();

$contract = $this->userContractRepository->show($id);
$mpdf = new Mpdf(['tempDir' => '/var/www/storage/temp', 'format' => [198, 280]]);
$contract = $this->addJsonDataToModelAttributes($contract);
$mpdf->SetHTMLFooter('<div style="text-align: right;">{PAGENO}/{nbpg}</div>');
$mpdf->WriteHTML($htmlStringView);
$mpdf->SetTitle($contract->title);
$mpdf->SetAuthor($contract->owner->email);
$mpdf->SetSubject(implode(", ", $contract->persons->pluck('full_name')->toArray()));
$mpdf->SetKeywords($id);
$mpdf->Output('/var/www/storage/app/' . $full_path);

【问题讨论】：

那不是宋体。显示您的代码。见stackoverflow.com/help/minimal-reproducible-example
您认为它有什么用处？没什么可展示的。
非常有用。它显示了你不做什么。

标签： css fonts mpdf

【解决方案1】：

默认情况下，Arial 不包含在 mPDF 分发中，替换为 DejavuSans。如果需要，您必须将 mPDF 实例指向字体文件。

$defaultConfig = (new Mpdf\Config\ConfigVariables())->getDefaults();
$fontDirs = $defaultConfig['fontDir'];

$defaultFontConfig = (new Mpdf\Config\FontVariables())->getDefaults();
$fontData = $defaultFontConfig['fontdata'];

$mpdf = new \Mpdf\Mpdf([
    'tempDir' => '/var/www/storage/temp',
    'format' => [198, 280],
    'fontDir' => array_merge($fontDirs, [
        __DIR__ . '/custom/font/directory',
    ]),
    'fontdata' => $fontData + [
        'arial' => [
            'R' => 'arial.ttf',
            'I' => 'arial-italic.ttf',
        ]
    ],
]);

见https://mpdf.github.io/fonts-languages/fonts-in-mpdf-7-x.html

【讨论】：