0

我需要为 IE7+ 实现像素完美的标记。我遇到的问题如下：网页视图和打印预览中字段的宽度不同。请参见以下示例：

<html>
    <style type="text/css">
    .input_multiline {
                    border:0;
                    height: 30px;
                    padding-left: 10px;
                    padding-top: 10px;
                    border-bottom:1px solid black;
                    font-family: monospace;
                    font-size:13pt;
                    margin-top:10px;
                }
    </style>

    <body>
        <input readonly = "readonly" class="input_multiline" style="width: 960px;" type="text" value="012345679 123456789 123456789 123456789 123456789 123456789 123456789 123456789 123456789 95chr"/>
    </body>
</html>

这里的输入字段可以容纳 95 个字符，但是当我打印它时，它只显示 91 个字符。使用不同的宽度和 CSS 设置，我得到的差异是一行最多 10 个字符。

有没有办法以某种方式解决这个问题并确保我在浏览器中看到的页面将被打印出来？

4

3 回答 3

1

要在屏幕上显示相同宽度的线条并打印在纸上，应以厘米或英寸为单位指定宽度，而不是以像素为单位。

于 2012-12-03T07:02:04.483 回答
0

打印介质中一行的字符数取决于纸张尺寸、纸张方向和页边距。您无法在 HTML 或 CSS 中控制它们。（@pageIE 不支持 CSS3 中的内容。）

它还取决于字体，因此如果您需要像素完美，请设置font-family为特定字体（不是monospace，这取决于浏览器设置）。

任何不适合打印行的内容通常都会被忽略。

于 2012-11-12T08:38:27.303 回答
-1

我认为您正在寻找“大小”属性： W3School 链接

但是要检查为什么打印时它看起来不同，您必须考虑整个样式表。打印布局也有不同的媒体查询。也许您可以调整打印布局，使其看起来与正常布局相同。

于 2012-11-12T08:32:51.297 回答