在mpdf中导入css的样式内容

编程问答 2022-05-14

问题描述

我在 PHP 中使用 html+css 代码来生成进度圈。问题是 mpdf 无法将 css 文件导入其中。即使我删除了 css 内容，它也会给出与下图相同的结果。如何导入 css 文件？

<?PHP
use setasign\Fpdi\Fpdi;

session_start();
ob_start();

require_once __DIR__ . '/vendor/autoload.PHP';

require_once('FPDI/autoload.PHP');
require_once('fpdf/fpdf.PHP'); 
require_once('FPDI/Fpdi.PHP'); 

$pdf = new \Mpdf\Mpdf();

$pdf->AddPage(); 

$pdf->setSourceFile('test/file.pdf'); 

$tplIdx = $pdf->importPage(1); 

$pdf->useTemplate($tplIdx,297,420,true); 

$html = '

<svg width="120" height="120" viewBox="0 0 120 120">
    <circle cx="60" cy="60" r="54" fill="none" stroke="#e6e6e6" stroke-width="12" />
    <circle class="percent val" cx="60" cy="60" r="54" fill="none" stroke="#f77a52" stroke-width="12" pathLength="100" style="--val: 57"/>
</svg>

';

while($data = $stmt->fetch(PDO::FETCH_OBJ)){
    $pdf->SetTextColor(0,169,224);
    $pdf->setFillColor(255,255,255); 
    $pdf->SetFont('DIN_Medium','','20'); 
    $pdf->WriteText(135,92,$data->ID);
}

$stylesheet = file_get_contents('css/styles.css');
$pdf->WriteHTML($stylesheet,1);
$pdf->WriteHTML($html,2);

$pdf->Output("$newfile.pdf","D");
ob_end_flush(); 
?>

Progress Circle

.content{
  --val: 0;
}

svg {
  transform: rotate(-90deg);
}

.percent {
  stroke-dasharray: 100;
  stroke-dashoffset: calc(100 - var(--val));
}

.val {
  --val: 0;
}
<svg width="120" height="120" viewBox="0 0 120 120">
    <circle cx="60" cy="60" r="54" fill="none" stroke="#e6e6e6" stroke-width="12" />
    <circle class="percent val" cx="60" cy="60" r="54" fill="none" stroke="#f77a52" stroke-width="12" pathLength="100" style="--val: 57"/>
</svg>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

htmlmpdfpdfpdfpdf