简体   繁体   中英

bold font weight not working with Google fonts in dompdf

I'm using dompdf to turn HTML code into pdf. I'm using Google fonts and are importing them like this:

 @import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800&display=swap');

When i use them in my css with:

 h1, h3, .text { font-family: 'Open Sans'; font-weight: 400; }

i get my text in the right font. Now when some of the text is bold like the headings or certain pieces of text that are bold, they don't get the right font weight. When i change the font-weight to above 400 they don't work anymore.

Does anyone know how to use multiple font weights in dompdf?

Until the release of Dompdf 0.8.4 numeric font weights were not supported. If you're using a version of Dompdf prior to 0.8.4 you can not use fonts defined with numeric weights.

Additionally, though numeric font weights are supported, there appears to be a bug in how Dompdf parses the Google Font URL when using with an @import rule. (ref issue 2054 ). You can work around this issue by using a link element instead.

Something like the following should work:

<html>
<head>

  <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800&display=swap" rel="stylesheet">

  <style>
    .opensans {
      font-family: 'Open Sans';
      font-weight: 400;
    }
</style>

</head>

<body>
  <h1 class="opensans">The quick red fox jumped over the large brown log.</h1>
</body>
</html>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM