使用CSS的嵌套表格

Question

我知道這是非常簡單的問題，但我不是設計師，所以我遇到了問題。

我附上了我期望使用<table>標籤製作的屏幕截圖。

Answer 1

你應該有這樣的搜索：d

你要找的Colspan Rowspan性能

簡單的例子是如何工作

<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>

Answer 2

使用HTML嵌套表格和Css用於樣式化ta玻璃和細胞邊界。事情是這樣的：

<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