web-dev-qa-db-ja.com

CSSを使用してプリンターの用紙サイズを設定する

プリンターのデフォルトサイズはA4で、古いドットマトリックスプリンターを使用して、サイズ8.5inx5.5inでペイスリップを印刷する必要があります。すべてのペイスリップDIVを固定の高さに設定しようとしましたが、

width: 175.6mm;
height:123.7mm;
margin-left:auto;
margin-right:auto;

それはペイスリップサイズに完全に適合しますが、印刷後、ペイスリップ紙はA4とは異なりすべて結合されるため、紙はその終わりまで回転し続けます。そして、プリンタの用紙サイズを変更したくないので、次のように設定します。

@media print 
{
   @page
   {
    size: 8.5in 5.5in;
    size: portrait;
  }
}

ただし、Googleの印刷プレビューChrome

enter image description here

実際にそうすることは可能ですか?または、ペイスリップが印刷された後に印刷を停止して、紙が回転し続けるのを防ぐ方法はありますか?

追伸Google Chromeのみを使用しています。

**更新しました:

「PDFとして保存」を選択した後、用紙サイズが変更されることに気付きました。デフォルトのプリンターを選択し直すと、用紙サイズが再び正しくなくなります。

13
Irene Ling

たぶんこの作品。

@media print 
{
   @page
   {
    size: 8.5in 5.5in;
    size: landscape;
  }
}

または

@media print 
{
   @page
   {
    size: 5.5in 8.5in ;
    size: landscape;
  }
}
7
pixparker

前回チェックしたとき、@ media印刷は主要なブラウザでサポートされていません。私はあなたに似た問題を抱えていたので、何週間も試してみた後、あきらめてサーバーサイドのPDF生成ライブラリ(PDF4NET)に行かなければなりませんでした。タイプセットの印刷されたドキュメントが必要な場合-HTMLでうまくいくとは思いません。

4
imjosh

今日はChrome 32.0.1700.107 mを使用しています

ページサイズ用に確立されたW3 CSS3標準 は、印刷インターフェイスでChromeから直接[PDFとして保存]オプションを使用すると効果的です。プリンタの使用は非常に異なることに注意してくださいChromeの印刷インターフェイスでは、プリンターのデフォルトサイズを使用しますが、SAVE AS PDFオプションの場合、CSSが確立したサイズを使用します。

さまざまなプロジェクトのさまざまなインターフェイスとゴーアラウンドソリューションで何年も苦労しました(たとえば、処理が重くてコードが面倒なサーバーからPDFを直接生成したり、Windows印刷インターフェイスを使用するようにユーザーに伝えたりするなど)。これは私にとって素晴らしい解決策であり、決定的なもののようです!

これで、サイト内のCSS3のみを使用して適切なサイズの用紙でPDFを作成でき、サードパーティのソフトウェアやその他のトリックを使用する必要はありません。

あなたの場合、最良の解決策は、プリンタで設定されているデフォルトの用紙サイズを変更することです。これは、アドバイスを与え、印刷から隠されている小さなフローティングdivを持つユーザーにアドバイスしました。しかし、「プリンタの用紙サイズに変更を加えたくない」場合、サーバー側での変更を避けたい場合は、printigからもう1ステップ必要です。最初にPDFそして、作成したPDFからプリンタに送信します。

4
DavidTaubmann

こんな感じでした

@page {
  size: <%= @size_card[0] %>cm  <%= @size_card[1] %>cm;
  margin: 0;
}

「ランドスケープ」または「ポートレート」の2番目のサイズプロパティで言っているように試してみましたが、最後のものをオーバーライドします。

1
Ramon Marques

ブラウザーのPrinter.itの設定へのアクセスは制限されていると思います。これは、オペレーティングシステムとプリンタードライバーの両方で実行されます(給紙装置をトラクターフィーダーとして選択するか、余白をカスタマイズとして選択します)。

1
RAJMOHAN