HTML代码校验出现Stray end tag "form"报错的原因、标红缘由及修复方法

报错产生原因 #

这个报错本质是HTML标签嵌套层级错位，最终导致闭合标签找不到对应的开标签，成为游离标签。
顺着代码的执行逻辑拆解就能定位问题：

• 写完三个带表单控件的div.form-group后，代码里提前写了一个</div>，本来是准备闭合外层装标题和表单的div.reg-left，但这个位置离得太早——此时<form>标签还没写完，提交按钮都还没放进表单内部，这个</div>就被解析器用来闭合外层的div.reg-left了。按照HTML的解析规则，当遇到的闭合标签和当前最靠内的开标签不匹配时，解析器会先把夹在中间没闭合的标签自动强制关掉，再匹配外层的闭合标签。也就是这里会先把没写完的<form>强制当成已闭合，再执行div.reg-left的关闭动作。
• 等到代码走到后面手动写的</form>时，前面的<form>已经被自动强制闭合了，这个</form>自然找不到对应的开标签，就抛出了Stray end tag "form"的错误。

代码编辑器标红的缘由 #

主流代码编辑器都内置了实时HTML语法校验功能，输入代码的时候会实时跟踪所有标签的开、闭配对关系和嵌套顺序。一旦检测到提前闭合导致的标签不匹配、游离标签，就会把所有关联的错误标签（包括没正确配对的开form、错位的</div>、游离的</form>）全部标红，提前暴露问题，不用等到浏览器打开页面才发现语法错误。

修复方法 #

核心是按照HTML“后进先出”的标签闭合规则理顺嵌套结构，调整错位的标签位置、补上缺失的闭合标签：

• 删除三个div.form-group后面提前写入的</div>，让提交按钮保持在<form>标签内部，等表单内容全部写完后再执行</form>闭合动作。
• 在</form>写完之后，按照嵌套层级从内到外依次补上所有缺失的闭合div标签（分别对应闭合div.reg-left、div.col-md-6、div.row、div.container），最后再闭合最外层的<section>标签。

修复后可正常通过校验的代码如下：

<section class="login-section reg-section card">
  <div class="container">
    <div class="row mt-5 ">
      <div class="col-md-6">
        <div class="reg-left">
          <h3>Account Login Details</h3>
          <form method="POST" action="">
            <div class="form-group">
              <label for="email">Email Address*</label>
              <input value="" type="email" name="reg_email" class="form-control " placeholder="Email" id="login_email" required>
            </div>
            <div class="form-group">
              <label for="password">Password*</label>
              <input type="password" name="password" class="form-control " placeholder="Password" required>
            </div>
            <div class="form-group">
              <label for="password_confirmation">Confirm Password*</label>
              <input type="password" name="password_confirmation" class="form-control " placeholder="Confirm Password" required>
            </div>
            <button type="submit" class="btn">Submit</button>
          </form>
        </div>
      </div>
    </div>
  </div>
</section>

内容的提问来源于stack exchange，提问作者abu abu