渲染页面后的两个 div 嵌套在第一个 div 中的第二个 div [重复]答案

【问题标题】：Two div after render page second div nested in first div [duplicate]渲染页面后的两个 div 嵌套在第一个 div 中的第二个 div [重复]
【发布时间】：2013-09-20 15:54:36
【问题描述】：

如果我插入两个封闭的空 div ，我会在渲染后将一个嵌套在另一个中。

来源：

<html>
<head></head>
<body>
    <div id="up"/> 
    <div id="prop"/> 
</body>
</html>

渲染：

<html>
<head></head>
<body>
    <div id="up">
        <div id="prop"></div>
    </div>
</body>
</html>

但是当我插入第一个块作为开始和结束标记时，这不会发生：

来源：

<html>
<head></head>
<body>
    <div id="up"> </div>
    <div id="prop"/> 
</body>
</html>

渲染：

<html>
<head></head>
<body>
    <div id="up"></div>
    <div id="prop"></div>
</body>
</html>

为什么会这样？

【问题讨论】：

Is it OK to use a self closing DIV tag? 和 stackoverflow.com/questions/7757523/… 的可能重复项

标签： html

【解决方案1】：

这是 HTML 而不是 XML。

HTML 不支持关闭标签，即<div id=up"/>。

格式良好的 Empty div 应如下所示：

<div id="up"></div>

【讨论】：

【解决方案2】：

注意HTML和XML的区别！

HTML 不允许“立即”关闭所有标记类型，请阅读本文了解更多信息：http://tiffanybbrown.com/2011/03/23/html5-does-not-allow-self-closing-tags/

也许您想使用 XHTML 来表示您对 XML 的期望的行为和语法。

【讨论】：

【解决方案3】：

也许是因为您应该始终关闭您的div 标签？..

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/div

标签省略：无，开始和结束标签都是强制性的。

【讨论】：