用div制作表格

Question

我需要做这个表 在HTML和CSS中：

仅使用<div>而不是<table>。 我发帖寻找建议。 我在互联网上四处看看 并且没有找到答案。 请帮忙！

Answer 1

您可以使用CSS样式属性＆＃34; table＆＃34;轻松完成此操作，然后在每个div标记中设置类。

＆＃13;

＆＃13;

.divTable{
    display: table;
    width: 100%;
}
.divTableBody {
    display: table-row-group;
}
.divTableRow {
    display: table-row;
}
.divTableCell, .divTableHead {
    display: table-cell;
    padding: 3px 10px;
        color: #013e7f;
        background-color: #ffffff;
        font-weight: bold;
}

＆＃13;

<div class="divTable">
    <div class="divTableBody">
         <div class="divTableRow">
              <div class="divTableCell">Asistentes</div>
              <div class="divTableCell">Cosistentes</div>
         </div>
         <div class="divTableRow">
              <div class="divTableCell">1</div>
              <div class="divTableCell">2</div>
              <div class="divTableCell">3</div>
         </div>
     </div>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 2

如果您无法使用表格元素，我建议您：

1）如果你想要一个简单的方法，你可以获得Bootstrap 3库： Getting Started: Bootstrap

2）Bootstrap有一个网格系统，可以自动将您的内容划分为整个页面的相等部分。我会考虑使用bootstrap，因为它非常容易使用，并且可以防止自己编写很多代码。 Documentation on Grid System in Boostrap

另一方面，您可以自定义要包含的库的哪个部分，这样您就不必仅为网格使用整个Bootstrap库。 Customize your Bootstrap Library