表 - 将元素垂直而非水平

Question

我工作的分配，其中所需的输出是沿着线的东西：

有人告诉我，我们是使用一张桌子来做到这一点。

矿（尚未办理任何CSS）的样子：

我的代码如下所示：

 <table> 
     <tr> 
      <td> 
       <table border="0"> 

        <td> 
         <select name="Continent"> 
          <option value="North America">North America</option> 
          <option value="South America">South America</option> 
          <option value="Asia">Asia</option> 
         </select> 
        </td> 
        <td> 
         <select name="Country"> 
          <option value="Canada">Canada</option> 
          <option value="Other">Other</option> 
         </select> 
        </td> 
        <td> 
         <select name="City"> 
          <option value="Ottawa">Ottawa</option> 
          <option value="New York">New York</option> 
          <option value="Sydney">Sydney</option> 
         </select> 
        </td> 
       </table> 
      </td> 
      <td> 
       <table> 
        <td>Checkboxes</td> 
       </table> 
      </td> 

     </tr> 
    </table> 

所以我想我的问题是：如何获得降下拉列表垂直堆叠？我曾尝试将它们放在自己的<tr>元素中，但它什么也不做，只是略微改变它们之间的间距。

我是否需要在表格中使用两个表格来处理两个表格？

这是在CSS中完成的，还是我必须首先在html中得到它？

Answer 1

你是这个意思吗？

<table border="1px solid"> 
 
<tr> 
 
<td><select name="Continent"> 
 
<option value="North America">North America</option> 
 
<option value="South America">South America</option> 
 
<option value="Asia">Asia</option> 
 
</select></td> 
 
<td rowspan="3">Chexbox</td> 
 
</tr> 
 
<tr> 
 
<td><select name="Country"> 
 
<option value="Canada">Canada</option> 
 
<option value="Other">Other</option> 
 
</select></td> 
 
</tr> 
 
<tr> 
 
<td><select name="City"> 
 
<option value="Ottawa">Ottawa</option> 
 
<option value="New York">New York</option> 
 
<option value="Sydney">Sydney</option> 
 
</select></td> 
 
</tr> 
 
</table>