Question

我有一个带有渲染问题的HTML页面，其中斜体字体被下一个字母的边界框剪切。我在带有postscript的HP LJ5100上进行了测试（目前我唯一需要的打印机）。这仅在从Chrome呈现页面时显示 - 它在Firefox上呈现正常。

以下是通过打印到文件并使用gsview进行渲染捕获的渲染文本示例。

Example of clipped glyphs

我的google-fu让我失望了。这是一个已知的Chrome错误或与页面设置错误的字体有关吗？

要重现的代码（HTML）

<html>
<head>
    <title>Page title</title>       
    <link rel="stylesheet" href="/CSS/RenderingTest.css" type="text/css"/>
</head>
<body>

<div id="main-content">
    <table class="specs">
      <tr>
      <td class="foo">
        <ul class="foo">
          <li class="foo">Blurb. <br><em><strong>Weight:</strong> 0.2t, <strong>price:</strong> Cr24,600.</em></li>
        </ul>
      </td>
      </tr>
    </table>
</div>

</body>
</html>

（和样式表）

div#main-content { 
    margin-top: 7em;
    padding-left: 1em;
    border-left: 1px solid #404040;
}

li {
    font: 90%/1.25 Tahoma, helvetica, sans-serif;
    margin-left: 1em;
    margin: 1px;
    padding: 0.5em;
    padding-left: 2em;
    padding-right: 1em;
    background-color: #E0E0E0;
    text-indent: -1em;
    list-style-type: square;
    list-style-position: inside;
}

table.specs {
    border-collapse: collapse;
    border: none;
    width: 100%;
}

td {
    font: 80%/1.25 Tahoma, helvetica, sans-serif;
    color: #404040;
    margin: 0;
    border: 0;
    padding: 0;
    padding-right: 2em;
    max-width: 40em;
    margin-top: 2em;
    margin-left: 13em;
    /*border-left: 1px solid #404040;*/
    /*margin-bottom: 2em;*/
}

td.foo {
    vertical-align: top;
    text-align: justify;
    margin: 0em;
    padding: 0em;
    margin-bottom: 0.5em;
}

ul.foo {
    list-style-type: none;
    text-decoration: none;
    padding: 0;
    margin: 0;
    background-color: #FFFFFF;
}

li.foo {
    margin: 0;
    margin-left: 2.5em;
    padding: 0em;
    list-style-type: square;
    list-style-position: outside;
    text-indent: 0;
    background-color: #FFFFFF;
    margin-bottom: 0.5em;
}

chrome中的斜体字体的打印呈现不正确

0 个答案: