2

私の会社では、印刷に print.css を使用しています。また、print.css を含む他の .css ファイルをオーバーライドする別の style.css があります。何らかの理由で、(オーバーライド ファイルにある) html5 ボイラープレートからの @media 印刷クエリがオンの場合、IE8 および IE9 は空白のページを印刷します。コメントアウトされていれば問題ありません。ここでの問題は何ですか？ボイラープレートから @media プリントを残したいと思います。

PRINT.CSS

@media print
{
body *
{
    visibility:hidden;
}

#basicShell #main,
#basicShell #main *,
.basicShell_container .content,
.basicShell_container .content *,
#mainShell_container .center_columnContent,
#mainShell_container .center_columnContent *
{
    visibility:visible;
}

#basicShell #main,
.basicShell_container .content,
#mainShell_container .center_columnContent
{
    position:absolute;
    left:0;
    top:0;
}
}

STYLE.CSS (すべてをオーバーライド)

@media print {
* { background: transparent !important; color: black !important; text-shadow: none    
!important; filter:none !important; -ms-filter: none !important; float: none 
!important;} /* Black prints faster: h5bp.com/s */
a, a:visited { text-decoration: underline; }
a[href]:after { content: " (" attr(href) ")"; }
abbr[title]:after { content: " (" attr(title) ")"; }
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /*  
Don't show links for images, or javascript/internal links */
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
thead { display: table-header-group; } /* h5bp.com/t */
tr, img { page-break-inside: avoid; }
img { max-width: 100% !important; }
@page { margin: 0.5cm; }
p, h2, h3 { orphans: 3; widows: 3; }
h2, h3 { page-break-after: avoid; }
}
4

3 に答える 3

6

HTML5 ボイラープレートでも同じ問題に遭遇しました。

私の場合、次の行であることが判明しました。

tr { page-break-inside: avoid; }

IE8/9 で空白ページが発生しました。ページのタグには大量のコンテンツ (1 ページ分以上) があり、IE はページをスキップしてコンテンツを切り取ることで処理することにしました。うん。

HTML5 ボイラープレートをいじらないようにするために、自分のスタイルシートに次のコードを追加して、問題を解決しました。

tr { page-break-inside: auto; }

問題は別のタグが原因である可能性があるため、page-break-inside プロパティを設定するものを確認してください。

于 2012-09-14T01:02:46.240 に答える
1

サイトにロードされるスタイルシートの優先順位を考慮する必要があります。現在、print.cssスタイルシートに次のように記載されています。

body * {
    visibility:hidden;
}

そのルールは基本的にドキュメント内の「すべて」を隠します。スタイルシートはすべてをオーバーライドすることになっているとおっしゃいましたが、styles.cssスタイルシートはどのような順序でヘッダーに読み込まれますか？print.cssシートがstyle.cssシートの後にある場合は、最初のルールが適用されます。

リンク参照に含まれているタイプの場合もありmediaますが、どちらが優先されるかはわかりません。リンクメディアタイプ、またはメディアクエリ。

于 2012-08-24T14:37:24.680 に答える
1

print.css の最初のルールは、すべてのサブ要素を非表示にしますbody。一部の要素を可視化することを意図しているように見えますが、マークアップ (公開されていません) が意図した方法でidandclass属性を使用していないため、おそらく失敗しているようです。

于 2012-08-24T14:33:59.240 に答える