浏览器双重关闭我的标签？标记无效？

Question

在我的 html 模板中，基于 Zurb Foundation ，我有以下代码：

<div id="top-bar">
  <div id="top-bar-top-cont"></div>
  <div class="row">
    <div class="large-12 columns">
      <p id="toplogo">
        <h3>some text</h3>
      </p>
    </div>
  </div>
</div>

当我检查代码源时，firefox 警告我关闭 p 标签时出现问题，颜色为红色。

在 firebug 源代码中，我看到它自动关闭了 p 标签和它周围的 div 标签。所以，它不能正常显示。

即使我将这段代码粘贴到此处，编辑器也显示了 p 和最外层的红色结束标记 div。

我这个html有错吗？

我错过了什么吗？

这是我的整个文档：

<!doctype html>
<html class="no-js" lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Foundation</title>
    <link rel="stylesheet" href="stylesheets/app.css" />
    <script src="bower_components/modernizr/modernizr.js"></script>
  </head>
  <body>
   <div id="top-bar">
  <div id="top-bar-top-cont"></div>
     <div class="row">
       <div class="large-12 columns">
         <p id="toplogo">
    <h3>some text</h3>
   </p>
       </div>
     </div> 
   </div>

    <script src="bower_components/jquery/dist/jquery.min.js"></script>
    <script src="bower_components/foundation/js/foundation.min.js"></script>
    <script src="js/app.js"></script>
  </body>
</html>

Answer 1

您收到此错误是因为 Firefox 不希望 <p> 标签内有任何标题标签，如 <h3>。因此，当 Firefox 在您的示例中遇到 <h3> 标签时，它会自动关闭 <p> 标签。您必须将 <h3> 标签放在 <p> 标签之外。

浏览器双重关闭我的标签？标记无效？

Browsers double-closing my tags? Invalid markup?

html

css

zurb-foundation