問題タブ [css-paged-media]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
267 参照

printing - @media print が Google で機能しない

@media printChromeで動作しない理由を見つけようとしています。IEでもFFでも大丈夫です。

クーポンのページを印刷する作業を行っていますが、Chrome で空白のページが印刷されています。

0 投票する
4 に答える
42951 参照

css-paged-media - cssを使用した印刷モードの各ページのヘッダーとフッター

Web アプリケーションがあり、レポートが 1 ページを超える可能性があり、すべてのページにヘッダーとフッターを印刷したいと考えています。私はこれを見つけて試してみました: 各ページでレポートヘッダーを繰り返します が、うまくいきませんでした.うまくいきません。

0 投票する
5 に答える
64300 参照

css - CSS ページ番号のブラウザー サポート

だから私はこのオプションを認識しています: Page numbers with CSS/HTML

印刷版のページにページ番号を追加するには、これが断然最良の方法のように思えますが、この方法のバリエーションをどこでも動作させることはできません。Chrome、Firefox、および IE9 で Windows 7 マシンを試しました。いくつかのリンクに基づいて、これは Prince XML のようなよりプロプライエタリなソフトウェアでサポートされているようです。これは、印刷版の Web ブラウザーでサポートされていますか?

空のhtmlファイルだけを作成して、頭の中でこれを2つのスタイルタグの間に追加しようとしました:

content: "TEXT";また、何かを表示できるかどうかを確認するために使用するだけでも単純化しました。これはどこでもサポートされていますか? 「これ」とは、具体的にはタグ@page@bottom-rightタグを意味しています。これは、コンテンツを何度も機能させるためです。

0 投票する
1 に答える
922 参照

html - CSS の「孤児」は行レベルまたはブロック レベルで動作する必要がありますか?

HTML ドキュメントを PDF にレンダリングしています。以前はWkhtmltopdfを使用していましたが、 Dompdfの方が改ページのサポートが優れているように見えるので、それに切り替えることを期待しています。

ドキュメントに孤立したコントロールを適用したいので、orphans実際に何が行われるかをしっかりと理解する必要があります。W3C から (ソース):

orphans プロパティは、ページの下部に残す必要があるブロック コンテナー内の最小行数を指定します。

Web で一貫して提供されている例は次のとおりです。

これは、段落テキストの 3 行分のスペースがない場合、次のページに強制的に改行されることを意味します。多くの順序付けられていないリストを含むドキュメントをレンダリングしているので、私にとっては次のようになります。

ただし、箇条書き項目ブロックが単独で孤立したり未亡人になったりしないように、順序付けられていないリストを分割することも理想的です。これができるといいですね:

これにより、改ページの上または下に単独で項目ブロックが表示されないようにすることが理想的です。ただし、これに対するブラウザー/レンダラーのサポートは不完全であり、上記の W3C では「ブロック」ではなく「ライン」という言葉を使用しています。したがって、上記はリスト項目内の段落行の制御にのみ影響し、リスト項目ブロック全体には影響しないと思います。その場合、これを行う CSS の方法はありますか?

0 投票する
1 に答える
209 参照

html - CSS ページ メディア スタイルを理解するためのいくつかの問題

CSS のページ化されたメディアについて疑問があります。

このコードのようなものがある場合:

正確に何が起こるのですか?このコードを説明してもらえますか? 私はドキュメントを読んでいますが、いくつかの問題を見つけています...

Tnx アンドレア

0 投票する
1 に答える
1904 参照

debugging - IE11 @page ルールを無視しますか?

印刷中のページに余白を設定しようとしています。クロムでは、見栄えがします。いえ、それほどでもないです。私はマージンを次のように設定しようとしています:

頭の中で次のように css ファイルを参照しています。

マージン値を微調整することでクロムでマージンをうまく調整できますが、IE11ではこれを完全に無視しているようです....

私は何を間違っていますか?

0 投票する
1 に答える
886 参照

css - CSS改ページ左/右

@page CSS ルールをプレビューするツールを知っている人はいますか? それができない場合、これらのルールを完全にサポートするドキュメントを印刷するために使用できるものはありますか?

http://www.w3.org/TR/CSS2/page.html

オペラが一番近い。左/右の改ページを除くすべてをサポートしますが (通常どおりに処理します)、それらを表示するには何かに印刷する必要があります (ライブ印刷プレビューを表示できません)。

0 投票する
2 に答える
1653 参照

css - CSS @page の異なるサイズ:最初の結果 @page 全体が同じサイズである

その印刷について、および印刷のみ。

CSS:

CSS で定義されているように、最初のページのみ高さ 1000 mm、残りのページは高さ 297 mm (A4) にする必要があります。

しかし Chrome では、2 ページ目から 297mm のように見えますが、すべてのコンテンツが消えています。

自分で試してみてください。Google Chrome を使用してhttp://fiddle.jshell.net/T4nnG/1/show/ を開いて印刷してみてください。プレビューを見てください。

「PDF として保存」を使用するとより鮮明に表示されますが、実際のプリンターを選択すると、最初のページが縮小されます、バグは同じです

Chrome だけかもしれませんが、私は Chrome 用のアプリしか使っていないので、Chrome で動作する限りは満足​​です。

私は何か間違ったことをしましたか?正しい CSS に関するアドバイスをお願いします。