根據我的代碼，我的HTML不工作

Question

爲什麼我的HTML不能根據我的代碼工作？請參閱JSFIDDLE。

的輸出是

F (textbox)

L (textbox)

button

右？我在這裏做錯了什麼？

<div> 
<tr> 
    <td> 
     <label>F</label> 
    </td> 
    <td> 
     <input type="text" style="width: 50px;" id="txtBS" /> 
    </td> 
</tr> 
<tr> 
    <td> 
     <label>L</label> 
    </td> 
    <td> 
     <input type="text" style="width: 50px;" id="txtBSLName" /> 
    </td> 
</tr> 
<tr> 
<button type="button" class="btn btn-primary" id="btnAlert"> 
    Add</button> 
</tr> 

Answer 1

tr不是div有效孩子。改爲使用table。以及您的按鈕缺少td作爲包裝。

請注意，除非您實際顯示錶格，否則表格佈局通常不適用。

<table> 
    <tr> 
     <td> 
      <label>F</label> 
     </td> 
     <td> 
      <input type="text" style="width: 50px;" id="txtBS" /> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <label>L</label> 
     </td> 
     <td> 
      <input type="text" style="width: 50px;" id="txtBSLName" /> 
     </td> 
    </tr> 
    <tr> 
     <td> 
      <button type="button" class="btn btn-primary" id="btnAlert"> 
       Add 
      </button> 
     </td> 
    </tr> 
</table> 

JSFiddle

Answer 2

您忘記添加<table>標籤

<div> 
 
<table> 
 

 

 
    <tr> 
 
     <td> 
 
      <label>F</label> 
 
     </td> 
 
     <td> 
 
      <input type="text" style="width: 50px;" id="txtBS" /> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td> 
 
      <label>L</label> 
 
     </td> 
 
     <td> 
 
      <input type="text" style="width: 50px;" id="txtBSLName" /> 
 
     </td> 
 
    </tr> 
 
    <tr> 
 
    <td><button type="button" class="btn btn-primary" id="btnAlert"> 
 
    Add</button></td> 
 
    </tr> 
 
    </table> 
 
</div>