html - Laravel Blade 中生成的 PDF 中未显示 Font Awesome 图标

标签 html css laravel pdf font-awesome

我在 HTML 中使用了 Font Awesome 图标,效果很好。但是当我生成这个 HTML 的 PDF 时,所有 CSS 和 HTML 都工作正常,只有 Font Awesome 图标没有显示。

$pdf = PDF2::loadView('templates.'.$request->template_code, ['section' => $section])
    ->setOption('page-size', 'A4')
    ->setOption('margin-bottom', '0mm')
    ->setOption('margin-top', '0mm')
    ->setOption('margin-right', '0mm')
    ->setOption('margin-left', '0mm');

$fileName = 'resumes/'.str_slug($section['info']['data']['first_name']).'-'.$user->id.'.pdf';

Storage::disk('public')->put($fileName, $pdf->output());

return Storage::disk('public')->url($fileName);

在这里,我在 Laravel Controller 中生成一个 PDF,并在 Blade 中使用这样的 Font Awesome 图标。

<i class="fa fa-star checked"></i>

我使用的是 Font Awesome CDN 版本。如何在我的 pdf 中显示图标?

最佳答案

你需要使用内联样式添加 fontawesome 在 html 中添加 <head> Blade 中的标签

<style>
    @font-face {
        font-family: 'fontawesome3';
        src: url('https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype');
        font-weight: normal;
        font-style: normal;
    }
    .fa3 {
        display: inline-block;
        font: normal normal normal 14px/1 fontawesome3;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

</style>

然后由前缀 使用 fa3 在你的头上

<i class="fa3 fa-star checked"></i>

关于html - Laravel Blade 中生成的 PDF 中未显示 Font Awesome 图标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55096954/

相关文章:

JavaScript 接口(interface)在我的 Android 应用程序中无法工作

jquery - 单击导航链接时使用 jQuery 为 div 的可见性设置动画

javascript - 在主 Laravel Blade 中包含 Bower 组件

php - 参数 1 已传递,必须是数组类型,给定字符串

php - Laravel - 限制特定 API 路由的速率

html - 如何动态更改输入类型文件的标题?

javascript - jQuery:单击以滚动到下一部分

c# 将IE浏览器的内容保存为html

html - 使用 css/html 将不同样式的背景图像分层

jquery - 通过单击另一个 div 将类添加到 div