Question

我有桌子，我想把我的标签放在标签下面。这是我的HTML代码：

<table>
    <tr>
       <th>Your Email</th>
       <td>
          <input type="text" name="userEmail" value="" id="userEmail" required="">
       </td>
    </tr>
    <tr>
       <th>Job Category</th>
       //I need break line here
       <td>
          <label><input type="radio" name="rd1" value="Programmer" id="rd1">Programmer</label><br>
          <label><input type="radio" name="rd2" value="Web Developer" id="rd2">Web Developer</label><br>
       </td>
    <tr>
 </table>

我的输出为我提供了<th>个标签中的文字，然后是旁边的<td>标签中的文字。我想将td内容低于th。我尝试使用<br>标签，但看起来在td标签之外不起作用。如果有人知道最好的解决方法，请告诉我。

Answer 1

您正在创建一个表，并且不能将任何内容放在表格单元格之外。如果要在标题下包含表单元素，只需创建一个带有标题的行和一个带有表单元素的行：

<table>
    <tr>
       <th>Your Email</th>
       <th>Job Category</th>
    </tr>
    <tr>
       <td>
          <input type="text" name="userEmail" value="" id="userEmail" required="">
       </td>
       <td>
          <label><input type="radio" name="rd1" value="Programmer" id="rd1">Programmer</label><br>
          <label><input type="radio" name="rd2" value="Web Developer" id="rd2">Web Developer</label><br>
       </td>
    <tr>
 </table>

Answer 2

将表头放在自己的行中：

<table>
  <tr>
    <th scope="row">Your Email</th>
    <td>
      <input type="text" name="userEmail" value="" id="userEmail" required="">
    </td>
  </tr>
  <tr>
    <th colspan="2">Job Category</th>
  </tr>
  <tr> 
    //I need break line here
    <td colspan="2">
      <label><input type="radio" name="rd1" value="Programmer" id="rd1">Programmer</label><br>
      <label><input type="radio" name="rd2" value="Web Developer" id="rd2">Web Developer</label><br>
    </td>
  </tr>
</table>

Answer 3

使用

将它们放在不同的行中

<table>
    <tr>
        <th scope="row">Your Email</th>
        <td>
           <input type="text" name="userEmail" value="" id="userEmail" required="">
        </td>
    </tr>
    <tr>
        <th>Job Category</th>
    </tr>//End row
       //I need break line here
    <tr> //start new row
        <td>
            <label><input type="radio" name="rd1" value="Programmer" id="rd1">Programmer</label><br>
            <label><input type="radio" name="rd2" value="Web Developer" id="rd2">Web Developer</label><br>
        </td>
    <tr>
</table>

如何在th和td之间设置换行符？

3 个答案: