0

IE7+ 用のピクセル パーフェクト マークアップを実装する必要があります。私が遭遇した問題は次のとおりです。フィールドの幅が Web ページ ビューと印刷プレビューで異なります。次の例を参照してください。

<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 の設定が異なると、1 行に最大 10 文字の違いがありました。

これをどうにかして修正し、ブラウザに表示されるページが同じように印刷されるようにする方法はありますか?

4

3 に答える 3

1

同じ幅の線を画面に表示して紙に印刷するには、幅をピクセルではなくセンチメートルまたはインチで指定する必要があります。

于 2012-12-03T07:02:04.483 に答える
0

印刷メディアの 1 行に収まる文字数は、用紙サイズ、用紙の向き、余白によって異なります。HTML や CSS でそれらを制御することはできません。( @pageCSS3 のものは IE ではサポートされていません。)

また、フォントにも依存するため、ピクセル単位の完全性が必要な場合はfont-family、特定のフォントに設定します (monospaceブラウザーの設定に依存する ではありません)。

通常、印刷された行に収まらないものはすべて無視されます。

于 2012-11-12T08:38:27.303 に答える
-1

「サイズ」属性を探していると思います: W3School リンク

しかし、印刷するとなぜ違うように見えるかを確認するには、スタイルシート全体を考慮する必要があります。印刷レイアウト用の個別のメディア クエリもあります。たぶん、印刷レイアウトを調整して、通常のものと同じように見えるようにすることができます.

于 2012-11-12T08:32:51.297 に答える