jquery - 改ページが挿入されるたびに特定の CSS を取得する

Question

ここに私のページがどのように見えるかの概要があります

.section
{
  height: 50px;
  width:50px;
  border:1px solid black;
  /*border-bottom:5px solid gray;*/
  margin:10px;
	margin-bottom:200px;
	page-break-inside: avoid;	
}

<div class='section'></div>
<div class='section'></div>
<div class='section'></div>
<div class='section'></div>
<div class='section'></div>
<div class='section'></div>
<div class='section'></div>

ここで期待しているのは、このページを印刷するときはいつでも、すべてのページの最初のボックスと最後のボックスに灰色の境界線を付ける必要があるということです。

誰かが以前にそのようなシナリオに出くわしたことがある場合は、助けてください.

現在、改ページで起動し、ページの最初の要素にアクセスするのに役立つ JavaScript トリガーを検索しています。しかし、誰かが他の検索行を提案できれば、それも役に立ちます。

更新 1: このコンテンツは動的に生成されます。ボックスのサイズは異なる場合があります。そのため、各ページにいくつのボックスが表示されるかはわかりません。

更新 2: ヘッダーとフッターについて考えました。しかし、それは完全に役に立ちません。最初と最後の DIV のコンテンツに特定のスタイルを追加する必要があるためです。