DIV 与 TABLE 布局
table{
border-top:1px solid #6E7B8B;
border-right:1px solid #6E7B8B;
width:500px;
}
td{
border-left:1px solid #6E7B8B;
border-bottom:1px solid #6E7B8B;
height:21px;
width:200px;
}
<table cellspacing="0" cellpadding="0">
<tr><td>1-1</td><td>1-2</td><td>1-3</td><td>1-4</td></tr>
<tr><td>2-1</td><td>2-2</td><td>2-3</td><td>2-4</td></tr>
<tr><td>3-1</td><td>3-2</td><td>3-3</td><td>3-4</td></tr>
</table>
==============================================
.table{
display:table;
border-top:1px solid #6E7B8B;
border-right:1px solid #6E7B8B;
width:500px;
}
.row {
display:table-row;
}
.row div {
display:table-cell;
width:200px;
height:21px;
border-left:1px solid #6E7B8B;
border-bottom:1px solid #6E7B8B;
word-wrap:break-word;
}
<div class="table">
<div class="row">
<div>1-1</div><div>1-2</div><div>1-3</div><div>1-4</div>
</div>
<div class="row">
<div>2-1</div><div>2-2</div><div>2-3</div><div>2-4</div>
</div>
<div class="row">
<div>3-1</div><div>3-2</div><div>3-3</div><div>3-4</div>
</div>
</div>
效果如下: