ホームページ > ウェブフロントエンド > CSSチュートリアル > HTML ページを印刷するための余白を設定するにはどうすればよいですか?

HTML ページを印刷するための余白を設定するにはどうすればよいですか?

Mary-Kate Olsen
リリース: 2024-11-09 08:20:02
オリジナル
946 人が閲覧しました

How to Set Margins for Printing an HTML Page?

HTML ページの印刷中に余白を設定する方法

印刷に別のスタイルシートを使用する場合、HTML ページの余白を調整することが重要です。紙上での最適なプレゼンテーション。ただし、スタイルシートでマージンを正しく設定する方法は必ずしも明確ではありません。一貫したマージンを確保するには、印刷用に指定するときにセンチメートル (cm) やミリメートル (mm) などの絶対単位を使用することが重要です。

たとえば、ドキュメントの四辺に 25 mm のマージンを設定するには、次のようにします。

body {
  margin: 25mm 25mm 25mm 25mm;
}
ログイン後にコピー

ブラウザがマージンを画面ベースの値に変換するため、マージンにピクセルを使用すると不一致が生じる可能性があることに注意してください。

フォント サイズには、印刷メディアのポイント (pt) を使用してください。

CSS スタイルで body 要素にマージンを設定しても、プリンター ドライバーやブラウザーによって制御されるマージンには影響しないことに注意することが重要です。印刷可能領域内のドキュメントの余白を調整します。

印刷された余白を完全に制御するには、@page ディレクティブを使用して用紙の余白を設定します。これは HTML 本文要素の外側のマージンに影響し、通常はブラウザによって制御されます。

@page ディレクティブを使用した例を次に示します。

@page {
    size: auto;
    margin: 25mm 25mm 25mm 25mm;
}

body {
    margin: 0px;
}
ログイン後にコピー

この手法は、Safari を除くすべての主要なブラウザで機能します。 。 Internet Explorer では、ユーザーは印刷プレビュー設定で余白を調整できます。

また、IE7 はページに合わせて印刷サイズを自動的に調整するため、設定された余白が崩れる可能性があることに注意してください。この動作を無効にするには、ユーザーは印刷プレビューで印刷サイズを 100% に設定する必要があります。

以上がHTML ページを印刷するための余白を設定するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート