为什么我的 HTML 代码显示在我的表单文本区域中？答案

【问题标题】：Why is my HTML code showing in my forms text area?为什么我的 HTML 代码显示在我的表单文本区域中？
【发布时间】：2012-12-19 12:23:30
【问题描述】：

我正在尝试使用以下代码在 HTML 中创建一个两列表单。

<div id="form-wrapper">
  <form class="contact_form" action="" method="post" name="contact_form">
    <ul>
      <div id="form_left">
        <li>
          <span class="required_field"> * Denotes a required field</span>
        </li>
        <li>
          <label for="name">Name:</label>
          <input type="text" name="name" placeholder="John Doe">
        </li>
        <li>
          <label for="telephone">Contact Number:</label>
          <input type="tel" name="telephone" placeholder="(01225) 123456">
        </li>
        <li>
          <label for="email">Email:</label>
          <input type="email" name="email address" placeholder="example@example.com">
        </li>
      </div>  
      <div id="form_right">
        <li>
          <label for="message">Message:</label>
          <textarea name="message" cols="40" rows="6" >
        </li>
      </div>
    </ul>
  </form>
</div>

(http://jsfiddle.net/qrttZ/)

但由于某种原因，它在文本区域窗口内显示了我的 HTML 代码的下半部分。

我看不到任何打开的标签，所以我不确定这是为什么。

【问题讨论】：

验证者会回答您的问题。提示：你缺少一个结束标签。
<ul> 然后<div> 然后<li>?请查找 HTML 列表元素。

标签： html forms web

【解决方案1】：

HTML 不需要 XHTML 自闭合短标签这一事实，例如<input /> 表示新手很容易犯这个错误，因为textarea 执行非常相似的目的。只是因为一个很好的理由它需要关闭。

<textarea name="message" cols="40" rows="6" ></textarea>

...

完成了，这个

<ul>
   <div id="form_left">
      <li>

不好。 <li> show follow <ul> 那里不应该有<div>。

还有

<label for="name">Name:</label>
<input type="text" name="name" placeholder="John Doe">

如果输入中没有id，则for 是无用的。

<label for="name">Name:</label>
<input type="text" name="name" id="name" placeholder="John Doe">

但是，如果您要使用在它和输入之间没有标记的标签，并且您没有对其进行样式设置

<label>Name: <input type="text" name="name" placeholder="John Doe"></label>

输出较少

【讨论】：