我前段时间提交了一个similar question 并得到了一个很好的答案，现在我想根据我在使用 Google 地图时注意到的一些事情稍微修改这个问题。
问题是，我一直使用<div style="clear:both"></div> 来清除浮动。例如，有时我需要创建一个空元素来填充 JS。现在，既然 HTML 是 XML 的子集，为什么我不能使用 <div style="clear:both" /> 而不是键入丑陋的结束标记。
我在之前的问题中得到了一个很好的答案，我承认我并没有完全理解，但是在使用 Google 地图时，我注意到Google had the same idea that I did。在他们的第一个代码示例中，他们使用了没有结束标记的<div id="map-canvas"/>。
所以我的新问题是，即使这不是完全正确的 HTML，是否真的会出现这种情况不起作用？
请，谢谢。
【问题讨论】：
现在，因为 HTML 是 XML 的子集
HTML 不是 XML 的子集。
HTML 4 及更早版本是 SGML 应用程序，但浏览器从未正确实现 SGML 规范。
XHTML 1.x 是一个 XML 应用程序，但如果您使用 XML 内容类型（如 application/xhtml+xml）提供 XHTML，浏览器只会使用 XML 解析规则。
HTML 5 有自己的解析规则，可以更好地反映浏览器的实际操作。它允许在元素的末尾添加一个/ 字符，为了那些沉迷于 XML 或语法高亮软件的人必须省略结束标记，但仅限于那些元素。
我注意到 Google 的想法与我相同。在他们的第一个代码示例中，他们使用了没有结束标记的
<div id="map-canvas"/>。
这是一个错误，在 HTML 中是不允许的。它只在浏览器中“有效”，因为文档的结尾出现在任何允许作为 div 元素的子节点的元素或文本的开始之前。
问题是，我一直使用
<div style="clear:both"></div>来清除浮动。
首先，这是解决问题的一种讨厌的方法。它需要一个额外的元素，并且可以在渲染元素的地方添加空间。几乎在所有情况下，最好在包含元素上设置 overflow: hidden 以使其包裹浮动。
【讨论】：
HTML 不是 XML 的子集。 HTML 具有不同的结构。有些元素是单数的（如图像），根本不需要结束标记或结尾 /。这样做的人，需要用适当的结束标签来关闭。
不过，有些人使用 XHTML，它基本上是使用 XML 语法的 HTML。这取决于您使用的文档类型。
在这种情况下，Google 的示例是错误的。它使用 Html 5 文档类型。如果您通过W3 validator 运行他们的 sn-p，它会告诉您：
第 26 行，第 26 列：用于非空 HTML 的自闭合语法 (/>) 元素。忽略斜线并将其视为开始标记。
<div id="map-canvas"/>
这也是大多数浏览器可能会发生的事情。他们读它，就好像 div 刚刚在那里打开一样。在某个时刻，它将自动关闭。 / 被忽略。
关于清除浮动：你的做法很旧，而且很丑，因为你需要额外的标记，这基本上是一个 CSS 问题。幸运的是，还有更好的方法，这里详细介绍了其中的几个：What methods of ‘clearfix’ can I use?
【讨论】：