web-dev-qa-db-ja.com

印刷中に表の境界が消えないようにするにはどうすればよいですか？

私はただ印刷可能なウェブサイトで働いています。

私が直面している問題の1つは、画面に正しく表示されているものの、一部の表の境界線が印刷されないことです。

FirefoxとChromeの両方を試しました。どちらも画面上にすべての表の境界線を表示しますが、印刷時には境界線の一部を省略します。

それらを印刷するには何をする必要がありますか？

print
3
lyle

印刷媒体のスタイルシート を作成することを検討してください。これは、セルの間隔と背景色の代わりにテーブルの境界線プロパティを利用します。

table {
    border:solid #000 !important;
    border-width:1px 0 0 1px !important;
}
th, td {
    border:solid #000 !important;
    border-width:0 1px 1px 0 !important;
}
8
danlefree

印刷スタイルシート、または既存のスタイルシート内の@mediaセクションの印刷を指定しましたか？

デフォルトでは、スタイルシートは画面上で正常に機能します（発見したとおり）。ただし、印刷CSSスタイルシートを明示的に指定しない限り、ページを印刷するときに、ブラウザーのデフォルトスタイル（通常は15pt Times New Romanなど）にデフォルト設定されます。

解決策1：2番目の印刷スタイルシートを追加するHTMLヘッドに以下の両方のタグを含めます。

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

次に、必要なフォーマットスタイルをscreenstyles.cssからprintstyles.cssにコピーします（または、両方のをスクリーンスタイルシートにリンクします）。

解決策2：スタイルシートは1つのみですが、@ mediaが印刷されています

0
Dane Sonders