如何去除角材料表的边框?

AMS*_*SVE 6 datatable angular-material angular

我做了一个有角度的材料表,当我缩小时,我看到整个表的一些边界,我不知道为什么会在那里。我真的不想看到他们有什么想法该怎么办??

[1]:https : //ibb.co/56mhnKs这是我的截图的链接,所以你可以看到我的意思是哪些边框。

所以正如你在屏幕截图中看到的,我想删除顶部和底部的巨大边框。

这是我的代码

<div class="table-responsive">
  <div class="tickets-table" style="width: 85%; max-width: 1600px; border: white">
    <table mat-table class="table-striped" style="width: 100%" [dataSource]="dataSource" matSort aria-label="Elements">
      <tbody>
      <!-- Id Column -->
      <ng-container matColumnDef="id">
        <th mat-header-cell *matHeaderCellDef mat-sort-header>Ticket ID</th>
        <a><td mat-cell *matCellDef="let row">{{row.id}}</td></a>
      </ng-container>

      <!-- Subject Column -->
      <ng-container matColumnDef="subject">
        <th mat-header-cell *matHeaderCellDef mat-sort-header>Title/Subject</th>
        <a><td mat-cell *matCellDef="let row">{{row.subject}}</td></a>
      </ng-container>

      <!-- Last updated Column -->
      <ng-container matColumnDef="status">
        <th mat-header-cell *matHeaderCellDef mat-sort-header>Last updated</th>
        <a><td mat-cell *matCellDef="let row">{{row.created}}</td></a>
      </ng-container>

      <!-- Status Column -->
      <ng-container matColumnDef="created">
        <th mat-header-cell *matHeaderCellDef mat-sort-header>Status</th>
        <a><td mat-cell *matCellDef="let row">{{row.status}}</td></a>
      </ng-container>

      <!--Header-->
      <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
      <tr mat-row (click)="selectRow(row.id)" *matRowDef="let row; columns: displayedColumns;"></tr>
      </tbody>
    </table>
Run Code Online (Sandbox Code Playgroud)

这是CSS。另外,如果你能告诉我如何在整个桌子周围制作白色边框会很好。

.tickets-table {
  overflow: auto;
  margin: 40px auto;
  /*position: relative;*/
  padding-right: 15px;
  padding-left: 15px;
  border: white;
  align-self: stretch;

}

.mat-header-cell {
  color: white;
  background-color: #000046;
  padding: 20px;
  border-color: white;
  align-self: stretch;
}

.mat-cell {
  width: fit-content;
  height: 1px;
  border-color: white;
  align-self: stretch;
}

.mat-row:nth-child(even){
  background-color: #000051;
}

.mat-row:nth-child(odd){
  background-color: #303061;
}
Run Code Online (Sandbox Code Playgroud)

小智 15

td.mat-cell{
    border-bottom-style: none;
}

th.mat-header-cell{
    border-bottom-style: none;
}
Run Code Online (Sandbox Code Playgroud)