间距和边距中的html表错误

Question

我想在链接Table

中给出的html表格

我尝试过但没有工作。 我的代码

＆＃13;

＆＃13;

.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;
}

＆＃13;

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

＆＃13;

＆＃13;

＆＃13;   

Answer 1

在你的css中添加这个

.table tr{
 height:100px;
 }

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

Answer 2

你可以删除＆＃34; rowspan＆＃34; -attribute，你的tds中已经有一个div。

将第二个tr放在css的高度和tds里面的三个div中，添加一个height属性。

Answer 3

注意到你有：

 border-spacing: 25px 5px;

将其更改为：

 border-spacing: 5px 5px;

此间距用于单元格边框之间的距离。 在这里，您可以阅读有关border-spacing的更多信息！