CSSページヘッダー - 印刷マージンの使い方は？

ヘッダーを各ページに印刷することはできますが、印刷マージンを新しくしました。私は@pageのCSSがうまくいくと思ったが、ページの余白には影響しないようだ。本文にマージンを設定すると、1ページ目で動作しますが、後続のページはデフォルトで先頭の余白を開始し、ヘッダーをテキストの上に置きます。すべてのブラウザでCSSページヘッダー - 印刷マージンの使い方は？

<style> 
.header { 
position: fixed; 
top: 0; 
} 
@page { 
size: 11in 17in; 
margin-left: 1in; 
margin-right: 1in; 
margin-top: 1in; 
margin-bottom: 1in; 
} 
</style> 

<body> 
<span class=header>This is the header</span> 
This is the text of the document. (repeat until I get to page 2) 
</body>

出典

2010-12-03 Ted Scheckler

'@ page'サポートは悪名高く信頼できません。どのブラウザを試しましたか？ –

印刷のサポートが非常に悪い年の間に未定着行っている多くの一般的なブラウザで恐ろしいバグでサポートされています。

簡単な答えは、特定のレイアウトを確保する必要がある場合は、HTML/CSS印刷を避けることです。おそらく動的に生成されたオンデマンドPDFを使用します。 iTextSharpなどのさまざまなPDFジェネレータAPIがあります。 Flashからの印刷は可能ですが、Flashがインストールされていて動作している（つまり、Flashblock、iOSがない）場合に限ります。

HTML/CSS印刷は、単純なレイアウトに制限する必要があります。フォーム印刷は、特に問題がある（特にFirefoxの場合）fieldset & のサポートの悪夢です。面白いことに、インターネットエクスプローラでは印刷サポートが最適です。

CSS3印刷サポートの指定が完了しておらず、時間がかかります。

一般原則：

背景や背景のCSS画像をサポートしていません（デフォルトでは - ユーザーがイントラネットアプリケーションのために彼らのブラウザの設定を変更することができます）。フォアグラウンドイメージのみが印刷されます。
ページサイズが惑星の周りで変わると、幅が流動的である必要があります。米国のレターフォーマットはA4レイアウトよりも短く、幅が広い
すべてのブラウザでさまざまな印刷方法がサポートされています。バグは軍団です。
印刷プレビューを使用してテストします。今4 1/2歳

出典

2010-12-29 07:13:41 GlennG

この回答は3歳ですが、私は同じ問題を抱えています。その間、印刷CSSのサポートは改善されましたか？具体的には、http://stackoverflow.com/questions/18173423/css-print-stylesheet-padding-on-the-second-page/18173467?noredirect=1#18173467 – Heraldmonkey

いいえ、位置はまだほとんど同じです。 –

受け入れ答えはこう述べています。

「短い答えは、あなたが特定のレイアウトを確保する必要がある場合はHTML/CSSの印刷を避けるためです。」

最近では、ブラウザで比較的単純なレイアウトのHTML/CSS印刷を行ったり、wkhtmltopdfなどのツールを使用すると、より複雑なレイアウトを使用することができます。また、http://www.toccon.com/toc2013/public/schedule/detail/26714

出典

2015-07-28 09:33:38

CSSページヘッダー - 印刷マージンの使い方は？

答えて

関連する問題