表转换为div

Question

为了优化我的内容我已经读过表格不是很好的做法,因此我试图将表格转换成div.然而,我正在努力将其转换为div.如何将下表转换为div？

.match-table {

    height: 38px;
    
}

.match-table tr {

      margin-bottom: 10px;
      padding-top: 10px;
        border-bottom:1px solid  #e5e5e5;
}



.match-icon {
    width: 38px;
    height: 38px;

}

.match-time {
    width:8%;
    height: 38px;
    text-align: right;
}

.match-home {
    text-align: right;

    width: 32%;
}
.match-score{
    text-align: center;

    width: 20%;
}
.match-away{
    text-align: left;

    width: 32%;
}

<table class="match-table" cellspacing="0" cellpadding="0">
<tbody>
<tr class="margin-tr">
<td class="match-icon">PBL</td>
<td class="match-home">Gambit</td>
<td class="match-score">2-3</td>
<td class="match-away">TSM</td>
<td class="match-time">22:00</td>
</tr>
<tr class="margin-tr">
<td class="match-icon">PBL</td>
<td class="match-home">Gambit</td>
<td class="match-score">2-3</td>
<td class="match-away">TSM</td>
<td class="match-time">22:00</td>
</tr>
</tbody>
</table>

Answer 1

对于表中最佳表示的数据,a <table>就可以了.您的示例似乎就是这种情况,因此我建议您只需将其保留为表格格式,除非有布局或设计组件确实表明需要更复杂的基于div的布局.

通常,使用表格时(不适当地)使用表格是不可取的做法.为了显示表格数据,它们很好.