2012-03-15 8 views
3

これは私の現在の問題です。HTML文書を複数のA4サイズのセクションにフォーマットする

約40枚のクーポンを含むHTMLページを生成したいとします。各クーポンはA4サイズのセクションが1つ必要です。

私はHTML文書を印刷する場合は、印刷された各ページに1つのクーポンを含めることを希望します。

これをどのように達成できるかについてのアイデアはありますか?

+1

class * a4 *でdivを使用してみましたか?css 'div.a4 {width:210mm;高さ:297mm; } '? –

+0

私の問題のためにサイズが助けられました。 –

答えて

4

次のCSSは、これは常にあなたにも達成するためにpage-break-beforeを使用することができます要素の後に改ページを挿入します

@media print { 
    .coupon-class 
    { 
    page-break-after:always; 
    } 
} 

あなたのDOM構造に適しているものは何でものためのクラス名をsubistitute、あなたが必要なものを達成しなければなりません要素の前に改ページします。

+0

これは私が問題のために必要としていたものです。 –

2

すべてのブラウザがHTMLを印刷する方法を決定し、ページサイズを変更するすべての種類のヘッダーとフッターを追加し、クライアントプリンタが実際に印刷する方法を追加するので、非常に正確なHTML解決方法は決して得られません。

クーポンのPDFを生成する方が、PHP拡張機能で簡単に行うことができます。

+0

+1 PDFはここに行く方法です。 –

+1

+1印刷が狂ったときにHTMLをレンダリングします。 –

+0

これは間違っていますが、CSS2 +にはかなり良いサポートを受けているページ区切り前/後のプロパティが含まれており、実際にかなり信頼できる印刷スタイリングを達成できる印刷メディアクエリと組み合わせると、あなたが必要とするのは、改ページのガーディアンであれば、CSSで簡単に達成できます。 –

0

あなたは、以下の手順を行うことができます。

  1. は、そのCSSスタイルで各クーポンについてwidth:100を定義します。これは、用紙の最大幅を使用します。
  2. 各クーポンのCSSプロパティにpage-break-after:alwaysを使用してください。これにより、次のページに次のクーポンが表示されます。 (http://msdn.microsoft.com/en-us/library/ms530842(v=vs.85).aspx)

クーポンの高さに注意することを忘れないでください。多くの行を入れないようにしてください。
クーポンごとに<fieldset>タグを使用して、CSSプロパティを適用できます。

+0

あなたは 'width:100%;'を意味しましたか? – AlicanC