在 mpdf 8 codeigniter 中插入和修改新的字体系列

问题描述

我使用 mpdf 以 pdf 格式显示照片用户。我尝试将新字体 Poppins 插入到 mpdf。我曾尝试使用 import 等 Google 字体中的 @import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');，然后我想更改字体粗细，但结果是一样的。

这是代码

<html>
   <head>
    <style>
        @import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');
    </style>
   </head>
   <body style="background-image: url('<?= base_url(); ?>assets/image.png');width:50%;height:10%;background-size:no-repeat;background-size:cover;text-align:center;">
      <h2 style="margin-top:550px;width:76%;text-align:center;position:absolute;z-index:200;font-family: 'Poppins',sans-serif;font-weight: 900;"><?= "name"; ?></h2>
   </body>
</html>

您知道如何正确更改字体粗细或添加字体系列吗？

解决方法

在 mpdf documentation 中，您需要在控制器中进行设置，这里是我用于 RockSalt 和 PT Caption 字体的代码段。确保将 *.ttf 文件放入相应的文件夹中，在我的情况下：/assets/_pdf/_fonts

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

$mpdf = new \Mpdf\Mpdf([
    'fontDir' => array_merge($fontDirs,[
        $_SERVER['DOCUMENT_ROOT'] . '/assets/_pdf/_fonts',]),'fontdata' => $fontData + [
        'rocksalt' => [
            'R' => 'rocksalt.ttf',],'ptsanscaption' => [
            'R' => 'ptsanscaption.ttf',]
    ],'default_font' => 'ptsanscaption'
]);

$html=$this->load->view('my_mpdf','',true);
$mpdf->WriteHTML($html);

注意：在我的视图文件 my_pdf（我构建我想输出的 html）中，以便在浏览器中看到“预览”（我使用相同的视图文件来构建 pdf 和预览），我正在使用

应用字体

<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=PT+Sans+Caption" />
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Rock+Salt" />

和往常一样的css

.title{
        font-family: 'Rock Salt',rocksalt;
}

编辑：为了改变你的字体粗细，你遵循相同的规则。只需将 Poppins-Regular.ttf 和 Poppins-Bold.ttf（或任何其他）复制到您的字体文件夹，并将您希望的字体变体添加到字体数组中：

$mpdf = new \Mpdf\Mpdf([
    'fontDir' => array_merge($fontDirs,'poppins' => [
            'B' => 'Poppins-Bold.ttf','poppins' => [
            'R' => 'Poppins-Regular.ttf','default_font' => 'ptsanscaption'
]);

然后创建一个css规则：

.my_style{
    font-family: 'Poppins'; 
    color:red; 
    font-size: 16px;
}

并将其应用到 html 中：

<div class="my_style">
    <b>bold text</b>
    regular text
</div>

mpdf