0
我有以下HTML表格，並且存在一些問題。首先，表中的行非常大，表格行應該足夠大以適應內部的內容。其次一些內部的div的脫節與申報單的行中的休息，特別是包含換到第二行如何控制表格行的高度
<!DOCTYPE html>
<html>
<head>
<style>
.stopHoriz {
display:inline-block;
border: 1px solid black;
width:75px;
height:75px;
text-align:center;
font-size: .8em;
}
.stopVertical {
margin-bottom:3px;
border: 1px solid black;
width:75px;
height:75px;
text-align:center;
font-size: .8em;
}
</style>
</head>
<body>
<table border="1">
<tr style="height:75px">
<td colspan="2">
<div style="padding-right: 30px; vertical-align:top">
<div class="stopHoriz">Amusement</div>
<div class="stopHoriz">State Park</div>
<div class="stopHoriz">Zoo</div>
<div class="stopHoriz">History</div>
<div class="stopHoriz">Marine Encounters</div>
<div class="stopHoriz">Onset</div>
<div class="stopHoriz">Museum</div>
<div class="stopHoriz">Beaches</div>
</div>
</td>
<td rowspan="2" style="width:75px">
<div style="padding-bottom: 30px; vertical-align:top">
<div class="stopVertical">Amusement</div>
<div class="stopVertical">State Park</div>
<div class="stopVertical">Zoo</div>
<div class="stopVertical">History</div>
<div class="stopVertical">Marine Encounters</div>
<div class="stopVertical">Onset</div>
<div class="stopVertical">Museum</div>
<div class="stopVertical">Beaches</div>
</div>
</td>
</tr>
<tr>
<td rowspan="2" style="width:75px;">
<div style="padding-top: 30px">
<div class="stopVertical">Beaches</div>
<div class="stopVertical">Museum</div>
<div class="stopVertical">Onset</div>
<div class="stopVertical">Marine Encounters</div>
<div class="stopVertical">History</div>
<div class="stopVertical">Zoo</div>
<div class="stopVertical">State Park</div>
<div class="stopVertical">Amusement</div>
</div>
</td>
<td>Main</td>
</tr>
<tr style="height:75px">
<td colspan="2">
<div style="padding-left: 30px">
<div class="stopHoriz">Beaches</div>
<div class="stopHoriz">Museum</div>
<div class="stopHoriz">Onset</div>
<div class="stopHoriz">Marine Encounters</div>
<div class="stopHoriz">History</div>
<div class="stopHoriz">Zoo</div>
<div class="stopHoriz">State Park</div>
<div class="stopHoriz">Amusement</div>
</div>
</td>
</tr>
</table>
</body>
</html>
對不起，你能告訴我更多關於你的第一個**問題嗎？ –
如果您查看此表，您會看到第一列非常高。在它的中心有一堆盒子。我希望第一行只能和內部盒子一樣高。 –