html表格间距和边距错误

Question

我想用 html 制作一个表格，就像链接 Table 中给出的那样

我试过了，但没用。 我的代码

.td1 {
	background-color: #cccccc;
	border: 2px solid black;
	padding: 10px;
	padding-bottom: 50px;
}

.td2 {
	background-color: red;
	border: 2px solid black;
	padding: 10px;
}

.td3 {
	background-color: green;
	border: 2px solid black;
	padding: 10px;
	padding-bottom: 200px;
}

.td4 {
	background-color: blue;
	border: 2px solid black;
	padding: 10px;
}

.td5 {
	margin: 5px;
	background-color: yellow;
	border: 2px solid black;
	padding: 10px;
}

.table {
    border-collapse: separate;
	border-spacing: 25px 5px;
	margin: 5px;
	border: 2px solid black;
}

<table width="100%" class="table">
    <tr><td colspan="3" class="td1" align="center"> <b>DIV1</b>
    </td></tr>
    <tr><td class="td2" align="center" rowspan="3"><b>DIV2</b></td>
    <td></td><td></td></tr>
    <tr><td class="td3" align="center" rowspan="2"><b>DIV3</b></td>
    <td></td></tr>
    <tr><td class="td4" align="center"><b>DIV4</b></td></tr>
    <tr><td colspan="3" class="td5" align="center"><b>DIV5</b>
    </td></tr>
</table>

Answer 1

在你的CSS中添加这个

.table tr{
 height:100px;
 }

http://jsfiddle.net/uwokm8oq/1/