如何以这种方式构建引导表？答案

【问题标题】：How to structure bootrap tables in this way?如何以这种方式构建引导表？
【发布时间】：2019-02-22 01:48:23
【问题描述】：

我希望以这种方式构建表格：

我试过这样做，但我不知道如何将两列放在一行中（英寸，厘米）

这是一个朋友的服装店，所以我很感激这方面的帮助。

【问题讨论】：

使用 colspan="2" 表示胸围、腰围等，请查看stackoverflow.com/questions/9830506/…

【解决方案1】：

this code will help you. check the below jsfiddle link

    https://jsfiddle.net/Gurmatpal/aq9Laaew/221894/

【讨论】：

你知道我怎样才能让它响应吗？所以它符合边距？
您可以在表格之前添加 div
[table goes here]
。

【解决方案2】：

你试过这样做吗？

table {
    font-family: arial, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

td, th {
    border: 1px solid #dddddd;
    text-align: left;
    padding: 8px;
    text-align:center;
}

.title{
   background-color:red;
}

.sub-title{
   background-color:lightgreen;
}

.footer{
  background-color:lightcoral;
}

<table>
   <thead>
      <tr class="title">
         <th colspan="7">Size Table</th>
      </tr>
      <tr class="sub-title">
         <th rowspan="2"></th>
         <th colspan="2">Bust</th>
         <th colspan="2">Bust</th>
         <th colspan="2">Bust</th>
      </tr>
      <tr class="sub-title">
         <th>CH</th>
         <th>CM</th>
         <th>CH</th>
         <th>CM</th>
         <th>CH</th>
         <th>CM</th>
      </tr>
   </thead>
   <tbody>
      <tr>
         <td>S</td>
         <td>col1</td>
         <td>col2</td>
         <td>col3</td>
         <td>Col4</td>
         <td>Col5</td>
         <td>Col6</td>
      </tr>
      <tr>
         <td>M</td>
         <td>col1</td>
         <td>col2</td>
         <td>col3</td>
         <td>Col4</td>
         <td>Col5</td>
         <td>Col6</td>
      </tr>
      <tr>
         <td>L</td>
         <td>col1</td>
         <td>col2</td>
         <td>col3</td>
         <td>Col4</td>
         <td>Col5</td>
         <td>Col6</td>
      </tr>
   </tbody>
   <tfoot>
      <tr class="footer">
         <th colspan="7">description</th>
      </tr>
   </tfoot>

</table>

【讨论】：

我希望在引导程序中执行此操作，因为它看起来更干净，不过感谢您的帮助。

【解决方案3】：

检查此代码。我想这会对你有所帮助

table {
    empty-cells: show;
    border: 1px solid #000;
}

table td,
table th {
    min-width: 2em;
    min-height: 2em;
    border: 1px solid #000;
}

<table>
    <thead>
        <tr>
            <th rowspan="2"></th>
            <th colspan="2">&nbsp;</th>
            <th colspan="2">&nbsp;</th>
        </tr>
        <tr>
            <th>a</th>
            <th>b</th>
            <th>c</th>
            <th>d</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td></td>
            <td>1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
         </tr>
    </tbody>
</table>

【讨论】：

我可以放什么代码片段让表格自动适应边距？