如何在DomPdf中使用Font Awesome或Vue组件

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

我正在尝试使用dompdf生成的pdf使用Element-ui中的字体真棒或vue组件，但没有任何效果。我在pdf刀片文件中有此]

<span style="font-family: FontAwesome !important">&#xF156;</span>
<i class="fas fa-pencil-alt"></i>

<el-button class="new-button" type="primary" size="small">
    Nuevo
</el-button>

但是图标不会显示，按钮也不会显示。这就是显示的内容

enter image description here

我不知道如何使它起作用，该怎么办？

laravel dompdf
1个回答
0
投票

Dompdf无法正确解析FontAwesome样式表，导致它错误地读取了字体系列（为什么不发布错误报告？]。>

您加入FontAwesome样式表后，可以通过重新定义fa类来解决此问题。

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css">
  <style type="text/css">
  .fa {
    display: inline;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 1;
    font-family: FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  </style>
</head>
<body>
  <p><span class="fa fa-envelope"></span> envelope</p>
</body>
</html>
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.