7

画面によく表示される html 形式の請求書があります。フォーマット済みの用紙に印刷したい。この論文には 3 つのセクションがあります

ヘッダー (ページの上部からの高さは固定)

本体 (1 ～ N 行で構成されるテーブル)

フッター (ページ下部からの高さは固定)

CSS を使用して、#InvFooter と CSS を使用して div を作成してみました

<link rel="stylesheet" href="print.css" type="text/css" media="print" />

@page { size:8.5in 11in; margin: 2cm }


#InvFooter {position:absolute;left:50px;bottom:0px;}

私には理解できない2つの問題があります。

  1. フッターを印刷ページの下部に固定する方法。
  2. テーブルの行が多すぎる場合に、ボディをページの固定セクションに制限し、別のページにオーバーフローする方法。
4

2 に答える 2

2

簡単な答え: しないでください。html/css は印刷用ではありません。現在のプリンターに合うように絶対サイズを「ハック」できたとしても、次の (または顧客の) プリンターに合うという保証はありません。

このような理由から、PDF が発明され、印刷された形式 (および高い移植性) に期待できるようになりました。

PDF を使用することで、固定 (紙) サイズが保証されます。

無料の pdf ソリューション (オープン ソース) だけでなく、.Net からオンザフライで/サーバー ベースから動的に PDF を生成できる商用ソリューション (たとえばDynamic PDFなど - 他にも多数あります) を見つけることができます。アドビ製品に依存しないアプリケーション。

于 2012-12-27T03:26:51.873 に答える
0

これは、私が出会った中で最も優れた CSS 印刷技術の集大成です。W3 標準への深いリンク、優れた例、サードパーティが推奨する HTML -> PDF ソフトウェア、および 16 の異なるページ余白セレクターを視覚化する便利な JPEG があります。それが私を始めさせ、今では 100 以上のさまざまな長さのプロジェクト サマリーを印刷して、エグゼクティブ レビューに持っていくことができます。

  1. 記事: https://www.smashingmagazine.com/2015/01/designing-for-print-with-css/

  2. 便利なページ マージン JPEG: https://media-mediatemple.netdna-ssl.com/wp-content/uploads/2014/12/1-image-margin-boxes-large-opt.jpg

  3. デモ HTML ブック: https://github.com/rachelandrew/css-for-print/blob/master/book.html

  4. デモ印刷 CSS: https://github.com/rachelandrew/css-for-print/blob/master/pdf-styles.css

お役に立てれば！

編集これらはあなたが探しているものかもしれません:

.invoice {
   page-break-before: always;
}

.invoice h1.title {
   page-break-after: avoid;
}

.invoice .line-item {
   page-break-inside: avoid;
   page-break-after: auto;
}

EDIT フォーマットされた用紙は、複数ページの請求書にどのように対応しますか? すべての請求書を個別に印刷する必要があります...うーん

于 2016-05-26T03:53:14.703 に答える