15

そのクラスがdivタグまたはtableタグにアタッチされるpage-break-insideCSSディレクティブを使用しようとしています(これはブロック要素でのみ機能する可能性があると思います。その場合は、次のようにする必要があります。テーブル)。

これを行う方法を正確に説明していると思われるすべてのチュートリアルを試しましたが、何も機能しません。これはブラウザサポートの問題ですか、それとも誰かが実際にこれを機能させているのでしょうか。CSSの正確なビットは次のようになります。

@media print {

  .noPageBreak {
     page-break-inside : avoid;
  }
}
4

7 に答える 7

5

Safari 1.3 以降 (4 については不明) はpage-break-inside をサポートしていません(試すか、こちらを参照してください: http://reference.sitepoint.com/css/page-break-inside )。Firefox 3 や IE7 もそうではありません (8 については知りません)。

実際には、この属性のサポートは非​​常にむらがあり、現時点ではまったく使用する意味がありません。訪問者の 10% でも、これをサポートできるブラウザーを持っていれば幸運です。

私が使用した解決策は、追加することでした

page-break-after:always

特定の div に追加するか、改行が必要な場所に「ページ ブレーカー」 div を追加します。これは非常に不器用です。なぜなら、それはあなたが望んでいることをまったく実行せず、コンテンツが印刷されたページの下部に到達しないためですが、残念ながらより良い解決策はありません (私が間違っていることを証明してください!)。

もう 1 つの方法は、余分な要素 ( display:none) をすべて削除し、メイン コンテンツを 1 つのメイン列に流すスタイルシートを作成することです。基本的には、1 列のテキストのみのドキュメントに変換します。

最後に、プリンターのスタイルを設定するときはフロートと列を避けてください。IE (および FF) の動作がおかしくなる可能性があります。

于 2009-07-31T16:13:50.523 に答える
3

Safari 1.3+ Opera 9.2+ Konquerer、およびIE8 はすべて、少なくともある程度はサポートしています。

Firefoxは明らかにまだそうではありません。

于 2008-09-22T21:43:07.410 に答える
2
于 2010-11-30T09:28:28.263 に答える
0

そのクラスがdivタグまたはtableタグにアタッチされるpage-break-insideCSSディレクティブを使用しようとしています(これはブロック要素でのみ機能する可能性があると思います。その場合は、次のようにする必要があります。テーブル)。

まず、推測する必要はありません。仕様を見るだけで、実際にはブロックレベルの要素にのみ適用されることがわかります。

次に、<div>要素は通常ブロックレベルの要素であるためpage-break-inside、要素に適用しても問題はありません<div>

最後に、それをでラップする必要はありません@media@mediaメディアに依存しないルールを1つのメディアのみに適用する場合、たとえば、1つのメディアのみに使用する場合にのみ必要ですdisplay: block。この場合、これらのルールはページングされたメディアにのみ適用されるため、他のメディアから非表示にする必要はありません。

于 2008-09-22T21:52:41.490 に答える
0

Safari1.3以降のサポートpage-break-inside

Konquerorもそうです。

于 2008-09-22T22:00:22.503 に答える
0

予備的な検索から、これに対するブラウザのサポートに関する最新の統計を見つけるのは困難ですが、Firefox 4beta6 はサポートし、Chrome 7 はサポートしていないようです。また、Chrome はテキスト行の途中でページを分割するため、テキストの一部が 1 つのページに表示され、その一部が次のページに表示されます。特徴的な細部への注意の欠如ですが、Google も Apple も印刷物を気にかけているとは思いません。

Firefox 4 は、印刷物に URL、ページ タイトル、サイト タイトル、ページ数、時間などの優れたヘッダーとフッターも追加します。良い。

于 2010-10-27T03:55:25.463 に答える
0

IE レンダリング (IE8+) に関するEamon Nerbonne の回答の詳細については、ブラウザーが標準モードであることを確認する必要があります。MSDN のこの記事には、問題を強制するために HTML にメタ タグを含める必要があることが示されています。

<meta http-equiv="X-UA-Compatible" content="IE=8" />

ぎこちなく感じますが、そこにあります...より一貫して機能するようです。

于 2011-07-28T13:45:36.270 に答える