我想知道如何制作这个表格单元格答案

【问题标题】：I'm wondering about how to make this table cell我想知道如何制作这个表格单元格
【发布时间】：2017-10-19 02:01:57
【问题描述】：

我正在尝试创建此表：

早些时候，我在下面这样做：

table { border-collapse: collapse; }
td, th { border: solid #777 1px; }

<table>
  <tr>
    <th rowspan="2" style="text-align: center; vertical-align: middle;">title1</th>
    <th colspan="7" style="text-align: center;">grade</th>
  </tr>
  <tr style="text-align: center;">
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
    <td>5</td>
    <td>6</td>
    <td>7</td>
    <td>8</td>
    <td>9</td>
    <td>10</td>
  </tr>
  <tr>
    <td rowspan="3">title_1</td>
    <td>sub_1</td>
    <td>sub_2</td>
    <td>sub_3</td>
  </tr>
</table>

但我无法制作 title_1 / sub_1 行、sub_2 行、sub_3 行或 num 和 1111 个单元格。我该怎么做？

【问题讨论】：

所以你想使用html创建一个如图所示的表格？

标签： html html-table cell

【解决方案1】：

我不知道我是否理解您的问题，但如果您正在寻找图片中显示的 html 表格，请参考此处。

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<div class="container">
  <table class="table table-bordered">
    <thead></thead>
    <tbody>
      <tr>
        <th colspan="2" rowspan="2">title1</th>
        <th colspan="7">grade</th>
      </tr>
      <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
      </tr>
      <tr>
        <td rowspan="3">title_1</td>
        <th>sub_1</th>
        <td>a</td>
        <td>a</td>
        <td>a</td>
        <td>a</td>
        <td>a</td>
        <td>a</td>
        <td>a</td>
      </tr>
      <tr>
        <th>sub_2</th>
        <td>a</td>
        <td>a</td>
        <td>a</td>
        <td>a</td>
        <td>a</td>
        <td>a</td>
        <td>a</td>
      </tr>
      <tr>
        <th>sub_3</th>
        <td>a</td>
        <td>a</td>
        <td>a</td>
        <td>a</td>
        <td>a</td>
        <td>a</td>
        <td>a</td>
      </tr>
      <tr>
        <th colspan="2">num</th>
        <td colspan="7">111</td>
      </tr>
    </tbody>
  </table>
</div>

【讨论】：