Нужно рисовать нижнюю границу в последней строке на каждой странице в html/css

Question

Я динамически генерирую pdf из HTML, который имеет контент, который может работать через страницы. Я использую IE11.

Когда есть таблица, которая работает на нескольких страницах, нижняя граница последней строки не отображается на каждой сломанной странице. Нижняя граница отображается только на последней странице или где таблица закрывается.

Есть ли способ применить нижнюю границу в этом случае.

Answer 1

Вам просто нужно поставить часть javascript и (border-collapse) в css. Я написал другие css только для стилизации.

var $foo = $('#foo'); 
 
var bodyLastRow = $foo.children('tbody').children('tr:last-child'); 
 
bodyLastRow.css({ 
 
    'border-bottom': '1px solid #555' 
 
});

#foo { 
 
    border-collapse: collapse; 
 
} 
 

 
#foo thead tr { 
 
    background: rgba(0,255,0,0.6); 
 
} 
 

 
#foo tbody tr { 
 
    background: rgba(0,255,0,0.3); 
 
} 
 

 
#foo tbody tr td, #foo thead tr td { 
 
    padding: 5px; 
 
}

<table id="foo"> 
 
    <thead> 
 
    <tr> 
 
     <td>Name</td> 
 
     <td>Email</td> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td>Ashish</td> 
 
     <td>ashish@gmail.com</td> 
 
    </tr> 
 
    <tr> 
 
     <td>Asdh</td> 
 
     <td>asdh@outlook.com</td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

$ ('# таблица Foo TBODY тр: последний ребенок') CSS ({ граница дна: # 555 }).