使用CSS的嵌套表

Question

我知道这是一个非常简单的问题，但我不是设计师，所以我遇到了问题。

我在此处附上了我期望使用<table>标记制作的截图。

Answer 1

对嵌套表和Css使用Html来设置表格和单元格边框的样式。像这样：

<table class="table demo-table">
<tbody>
  <tr>
    <td colspan="2"></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>
      <table class="table demo-table2">
        <tbody>
          <tr>
            <td></td>
            <td></td>
          </tr>
          <tr>
            <td></td>
            <td></td>
          </tr>
        </tbody>
      </table>
    </td>
    <td></td>
    <td colspan="2"></td>
  </tr>
</tbody>
</table>

和Css：

.demo-table {
  border: 1px solid black;
  display:table;
}

.demo-table td {
  height:50px;
  width:50px;
}

.table td {
  border: 1px solid black;
}

查看渲染表here

Answer 2

你应该搜索这个：D

您所看到的是Colspan Rowspan属性

简单示例如何运作

＆＃13;

＆＃13;

<table border=1 width=100%>
<tr><td>Cell 1</td><td>Cell 2</td><td rowspan=2>Cell 3</td></tr>
<tr><td>Cell 4</td><td>Cell 5</td></tr>
</table>

＆＃13;

＆＃13;

＆＃13;