問題タブ [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.
html - 印刷されるページごとに最後の要素のスタイルを変える
要素のリストがあります(任意の長さ)。ただし、ユーザーが印刷するときに、すべてのページの最後の要素のスタイルを変更したいと考えています。
これまでのところ、使用してみ@page {.el:last-child...}
ましたが、何もしません。を使用するとel:last-child
、最後のページの最後の子にのみスタイリングが適用されます。
どんな助けでも大歓迎です。
私は次のHTMLを持っています:
css - 数ページ後に CSS 実行要素カウンター スタイルを変更する
FlyingSaucer を使用して、実行中のヘッダーにページ番号を持つ PDF ドキュメントを生成しています。私が達成しようとしているのは、ヘッダーに使用される実行中の要素に適用されるカウンターのスタイルを変更できるようにすることです。
FlyingSaucer で CSS を適用しているため、javascript を使用できません。
html の例:
CSS:
この css は、ドキュメント全体にヘッダーを正しく適用します。
配置されます。
上記のページ スタイル ( lower-roman ) を使用してドキュメントを開始しようとしています。ドキュメント内の特定の場所の後で、right-header のコンテンツを変更するか、残りの @page コンテンツを別の実行要素に置き換えたいとします。スタイリングが 10 進数に設定されたドキュメント。
FlyingSaucer が CSS3 のサポートを制限していることは知っていますが、そのような問題の解決策 (FlyingSaucer だけに限らない) を見つけることができません。
FlyingSaucer では css ルールを使用してドキュメントの任意の時点でカウンターをリセットできるため、実行中のヘッダーの内容は以前のヘッダーに影響を与えずに変更できます。
そして変化はその時点以降にのみ目に見えます。
したがって、私の現在のステータスは、小文字のi-iv(タイトルページ、目次など)で番号が付けられたページがあり、その後iにリセットしてドキュメントの最後までインクリメントすることです。私がする必要があるのは、変更することだけです
に
または、表示されている実行中の要素を新しいものに切り替えます。
この問題を解決する別の可能性を追加する、私が試した別の解決策:
このコードでは、解決策は #forcontent を有効にし、#content の先頭で #before を無効にすることだと思います。~ セレクターを使用してみましたが、前の要素を変更することはできません。
これをどのように達成できるか、または私が試すことができるさまざまなソリューションを教えてくれる人はいますか?