Отображение границы-дна только до последнего ряда <tbody>в угловых - PullRequest
0 голосов
/ 05 мая 2019

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

<table class="table table-borderless" id="testTable">
<tbody *ngFor="let sa of this.data?.activedata">

        <tr *ngIf="sa.type==='run'">
          <th scope="row">Fasting</th>
          <td>{{sa.data[0]?.value}} {{sa.data[0]?.unit}}</td>
          <td>{{sa.data[1]?.value}} {{sa.data[1]?.unit}}</td>
          <td>{{sa.data[2]?.value}} {{sa.data[2]?.unit}}</td>
        </tr>
        <tr *ngIf="sa.type==='eat'">
          <th scope="row">Post Meal</th>
          <td>{{sa.data[0]?.value}} {{sa.data[0]?.unit}}</td>
          <td>{{sa.data[1]?.value}} {{sa.data[1]?.unit}}</td>
          <td>{{sa.data[2]?.value}} {{sa.data[2]?.unit}}</td>
        </tr>
        <tr *ngIf="sa.type==='dance'">
          <th scope="row">Pre Meal</th>
          <td>{{sa.data[0]?.value}} {{sa.data[0]?.unit}}</td>
          <td>{{sa.data[1]?.value}} {{sa.data[1]?.unit}}</td>
          <td>{{sa.data[2]?.value}} {{sa.data[2]?.unit}}</td>
        </tr>

      </tbody>
</table>

Это мой код CSS:

.table-borderless td, .table-borderless th 
{ 
border: 0px !important;
 }

 tbody,thead{
    border-top:none !important;
 }

tbody tr:last-child{
    border-bottom:1px solid red;
}

Когда я удаляю .table-borderless, я снова получаю границу для всех элементов. Пробовал со свойством border-top вместо border для .table-boderless. До сих пор не работает. Что мне здесь не хватает?

...