注意:下面的答案在2012年写的时候是正确的。从那以后，事情发生了一些变化。HTML规范现在定义了两种类型的自定义元素——“自主自定义元素”和“自定义内置元素”。前者可以去任何地方措辞内容是预期的;这是主体内的大部分位置，但不是例如ul或ol元素的子元素，或在除td、th或标题元素之外的表元素中。后者可以去任何它们扩展的元素可以去的地方。

这实际上是元素内容模型积累的结果。

例如，根元素必须是html元素。

html元素只能包含head元素和body元素。

The body element may only contain Flow content where flow content is defined as the elements: a, abbr, address, area (if it is a descendant of a map element), article, aside, audio, b, bdi, bdo, blockquote, br, button, canvas, cite, code, command, datalist, del, details, dfn, div dl, em, embed, fieldset, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, i, iframe, img, input, ins, kbd, keygen, label, map, mark, math, menu, meter, nav, noscript, object, ol, output, p, pre, progress, q, ruby, s, samp, script, section, select, small, span, strong, style (if the scoped attribute is present), sub, sup, svg, table, textarea, time, u, ul, var, video, wbr and Text

等等。

在任何情况下，内容模型都不会说“你可以把任何你喜欢的元素放在这个里面”，这对于自定义元素/标记来说是必要的。

自定义标记在HTML5中无效。但目前浏览器支持解析它们，你也可以使用css来使用它们。因此，如果你想为当前的浏览器使用自定义标记，那么你可以。但是，一旦浏览器实现了严格用于解析HTML内容的W3C标准，这种支持可能就会消失。

自定义元素规范可以在Chrome和Opera中使用，也可以在其他浏览器中使用。它提供了一种以正式方式注册自定义元素的方法。

自定义元素是可以定义的DOM元素的新类型 作者。与无状态且短暂的装饰器不同，自定义 元素可以封装状态并提供脚本接口。

自定义元素是更大的W3规范Web组件的一部分，另外还有模板、HTML导入和影子DOM。

Web组件使Web应用程序作者能够使用 视觉的丰富程度和交互性是CSS无法实现的 单独使用，并且易于组合和重用，而不可能使用脚本 今天库。

但是，在谷歌开发人员的这篇关于自定义元素v1的优秀通览文章中:

自定义元素的名称必须包含破折号(-)。因此<x-tags>、<my-element>和<my-awesome-app>都是有效名称，而<tabs>和<foo_bar>则不是。这个需求是为了让HTML解析器能够区分自定义元素和常规元素。当新标签添加到HTML中时，它还可以确保向前兼容性。

一些资源

Web组件示例可从https://WebComponents.org获得 WebComponents.js充当了Web组件的填充，直到它们在任何地方都得到支持。参见WebComponents.js github页面和web浏览器支持表。

引用HTML5规范的可扩展性部分:

对于标记级特性，可以限制在XML序列化中，并且不需要在HTML序列化中得到支持，供应商应该使用名称空间机制来定义自定义名称空间，其中支持非标准元素和属性。

如果你在使用HTML5的XML序列化，你可以这样做:

<greeting xmlns="http://example.com/customNamespace">Hello!</greeting>

但是，如果您使用的是HTML语法，那么您所能做的事情就会受到很大的限制。

对于打算与HTML语法一起使用的标记级特性，扩展应该限制为“x-vendor-feature”形式的新属性[…]不应该创建新的元素名称。

但是这些说明主要是针对浏览器供应商的，他们可能会为他们选择创建的任何自定义元素提供视觉样式和功能。

不过，对于作者来说，虽然在页面中嵌入自定义元素是合法的(至少在XML序列化中是这样)，但除了DOM中的一个节点之外，您不会得到其他任何东西。如果你想让你的自定义元素实际做一些事情，或者以某种特殊的方式呈现，你应该看看自定义元素规范。

要了解这个主题的更温和的入门知识，请阅读Web组件介绍，其中还包括关于Shadow DOM和其他相关规范的信息。这些规范目前仍是工作草案——你可以在这里看到当前的状态——但它们正在积极地开发中。

例如，greeting元素的简单定义可能是这样的:

<element name="greeting">
  <template>
    <style scoped>
      span { color:gray; }
    </style>
    <span>Simon says:</span>
    <q><content/></q>
  </template>
</element>

这告诉浏览器以引号显示元素内容，并以文本“Simon说:”为前缀，其样式为灰色。通常，像这样的自定义元素定义将存储在一个单独的html文件中，您将使用链接导入该文件。

<link rel="import" href="greeting-definition.html" />

如果你想，你也可以将它内联。

我用你可以在这里看到的Polymer polyfill库创建了上述定义的工作演示。注意，这是使用旧版本的聚合物库-最新版本的工作方式完全不同。然而，由于规范仍在开发中，我不建议在产品代码中使用这种方法。

我想指出的是，“有效”这个词在这里有两种不同的含义，其中任何一种都是潜在的，嗯，有效的。

Should an HTML document with custom tags be considered valid HTML5? The answer to this is clearly "no." The spec lists exactly what tags are valid in what contexts. This is why an HTML validator will not accept a document with custom tags, or with standard tags in the wrong places (like an "img" tag in the header). Will an HTML document with custom tags be parsed and rendered in a standard, clearly-defined way across browsers? Here, perhaps surprisingly, the answer is "yes." Even though the document would not technically be considered valid HTML5, the HTML5 spec does specify exactly what browsers are supposed to do when they see a custom tag: in short, the custom tag acts kind of like a <span> - it means nothing and does nothing by default, but it can be styled by HTML and accessed by javascript.

注意:下面的答案在2012年写的时候是正确的。从那以后，事情发生了一些变化。HTML规范现在定义了两种类型的自定义元素——“自主自定义元素”和“自定义内置元素”。前者可以去任何地方措辞内容是预期的;这是主体内的大部分位置，但不是例如ul或ol元素的子元素，或在除td、th或标题元素之外的表元素中。后者可以去任何它们扩展的元素可以去的地方。

这实际上是元素内容模型积累的结果。

例如，根元素必须是html元素。

html元素只能包含head元素和body元素。

The body element may only contain Flow content where flow content is defined as the elements: a, abbr, address, area (if it is a descendant of a map element), article, aside, audio, b, bdi, bdo, blockquote, br, button, canvas, cite, code, command, datalist, del, details, dfn, div dl, em, embed, fieldset, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, i, iframe, img, input, ins, kbd, keygen, label, map, mark, math, menu, meter, nav, noscript, object, ol, output, p, pre, progress, q, ruby, s, samp, script, section, select, small, span, strong, style (if the scoped attribute is present), sub, sup, svg, table, textarea, time, u, ul, var, video, wbr and Text

等等。

在任何情况下，内容模型都不会说“你可以把任何你喜欢的元素放在这个里面”，这对于自定义元素/标记来说是必要的。