最近、サポートされているブラウザのCSSコードで、<thead>
ブロックが各ページの上部に表示されています(display: table-header-group;
:@media print {}
)。これにより、アプリケーションでテーブルを印刷するコードが大幅に簡略化されます。各ページにスタイリングヘッダーが印刷されています
しかし、私のクライアントはスタイルについて非常に気難しいです。再印刷されたヘッダーグループには元のヘッダーのスタイルの一部がありません。つまり、border-bottom-style
とborder-bottom-width
は、ヘッダーをテーブル本体から区切ります。これは難しい要件だと思われるので、これらのスタイルをこれらのヘッダーグループに含めることができるようにしたいと思います。
私はこの条件を満たすためにこれらのスタイルを印刷するようにFirefoxを強制しようと試みましたが、これらの方法では望みの結果が得られないようです。私が試したいくつかの例:
@media print {
thead {
display: table-header-group;
border-bottom-style: solid;
border-bottom-width: 3px;
}
}
と
<thead style="border-bottom-style: solid; border-bottom-width: 3px;"></thead>
と
table.class thead {
border-bottom-style: solid;
border-bottom-width: 3px;
}
と
table.class th {
border-bottom-style: solid;
border-bottom-width: 3px;
}
私の質問を、そして:設定する方法がありますこれらの再印刷されたヘッダーグループのスタイル?または、ブラウザはちょうどスパータンのデフォルトの表ヘッダースタイル(太字のテキスト)を使用していますか?
この質問に既に回答して回答があった場合は、私を許してください。私は周りを検索したが、この特定の問題については何も見つけることができなかった。 display: table-header-group;
には多くの質問がありましたが、ヘッダーグループのスタイリングに関しては何もありませんでした。ヘッダー行のセルに境界線を設定する
正しく印刷されないものの完全な例をアップロードできますか? – Jason
以下のコメントで指摘したように、この問題はテーブル上のもう1つの相反するスタイル(具体的には、「境界崩壊:崩壊」)でした。私はちょうど 'cellspacing =" 0 "'を使用して切り替えて、問題は解決しました。 – Chris