Html 输入字段不是'；在表单中不能单击文本区域。引导程序3

出于某种原因，当我使用Bootstrap3将文本区域添加到表单时，输入字段变得不可单击，但如果我将文本区域取出，它们似乎工作正常

我的代码：

<div class="row">
<form class="form col-lg-12" role="form">
  <div class="col-lg-6">
    <label for="Name">Your Name:</label>
    <input type="email" class="form-control cntct" placeholder="Name" />
  </div>
  <div class="col-lg-6">
    <label for="Email">Your Email Address:</label>
    <input type="text" class="form-control cntct" placeholder="Email" />
  </div>
    <div class="col-lg-12">
        <label class="msg" for="Message">Your Message:</label>
            <textarea class="form-control" rows="5" placeholder="Message"></textarea>
    </div>
  <button type="submit" class="btn btn-cntct">Send Your Message</button>
</form>
</div>

你的名字：
您的电子邮件地址：
您的留言：
发送您的消息

非常感谢任何人的帮助。如果您需要该链接才能实时查看，则url为，您可以在页面底部查看联系人表单

谢谢：）

你的名字：
您的电子邮件地址：
您的留言：
发送您的消息

试着给你的班级col-lg-6一个比col-lg-12更高的z指数

目前，它们相互重叠

.col-lg-6 {
    z-index:5;
}

.col-lg-12 {
     z-index:1;
}

---

包含文本区域的div位于包含文本输入的div的顶部

您的.col-lg-6类是左浮动的，而您的.col-lg-12类不是左浮动的，因此它会重叠

---

添加一个浮动：左；至.col-lg-12或添加一个清晰的：左；到包含textarea的div。

您应该将表单内容放在行中，在这种情况下，textarea将位于自己的行中。要做到这一点，就不需要处理列等的css，否则您可能会想，首先为什么要使用网格系统

更新代码：

<div class="row">
<form class="form col-lg-12" role="form">
  <div class="row">
      <div class="col-lg-6">
          <label for="Name">Your Name:</label>
          <input type="email" class="form-control cntct" placeholder="Name" />
      </div>
      <div class="col-lg-6">
          <label for="Email">Your Email Address:</label>
          <input type="text" class="form-control cntct" placeholder="Email" />
      </div>
   </div>
   <div class="row">
      <div class="col-lg-12">
          <label class="msg" for="Message">Your Message:</label>
          <textarea class="form-control" rows="5" placeholder="Message"></textarea>
      </div>
  </div>
  <div class="row">
      <div class="col-lg-12">
           <button type="submit" class="btn btn-cntct">Send Your Message</button>
      </div>
  </div>
</form>
</div>

你的名字：
您的电子邮件地址：
您的留言：
发送您的消息

这不是一个很好的标记（虽然比以前更好），但这是适合您的网格系统

<div class="row">
<form class="form col-lg-12" role="form">
  <div class="row">
      <div class="col-lg-6">
          <label for="Name">Your Name:</label>
          <input type="email" class="form-control cntct" placeholder="Name" />
      </div>
      <div class="col-lg-6">
          <label for="Email">Your Email Address:</label>
          <input type="text" class="form-control cntct" placeholder="Email" />
      </div>
   </div>
   <div class="row">
      <div class="col-lg-12">
          <label class="msg" for="Message">Your Message:</label>
          <textarea class="form-control" rows="5" placeholder="Message"></textarea>
      </div>
  </div>
  <div class="row">
      <div class="col-lg-12">
           <button type="submit" class="btn btn-cntct">Send Your Message</button>
      </div>
  </div>
</form>
</div>