我想创建类似于
<menu>
<lunch>
<dish>aaa</dish>
<dish>bbb</dish>
</lunch>
<dinner>
<dish>ccc</dish>
</dinner>
</menu>
这能在HTML5中完成吗？ 我知道我可以用
<ul id="menu">
<li>
<ul id="lunch">
<li class="dish">aaa</li>
<li class="dish">bbb</li>
</ul>
</li>
<li>
<ul id="dinner">
<li class="dish">ccc</li>
</ul>
</li>
</ul>
但这样会使代码可读性大大降低 :(
虽然它们不是HTML5（参见Are custom elements valid HTML5?和HTML5规范），但是您可以在浏览器中使用自定义标签。
假设您想使用名为<stack>的自定义标签元素，这里是您应该采取的措施...
步骤1：
在CSS样式表中规范化其属性（类似于CSS重置）- 示例：
stack{display:block;margin:0;padding:0;border:0; ... }
第二步
为了使其在旧版本的Internet Explorer中正常工作，您需要将此脚本附加到标头（如果您需要在旧版本的IE中使用它，则非常重要！）：
<!--[if lt IE 9]>
<script> document.createElement("stack"); </script>
<![endif]-->
<stack>Overflow</stack>
随意设置属性...
<stack id="st2" class="nice"> hello </stack>
我对这些答案并不十分确定。正如我所阅读的： “自始至今，HTML一直允许自定义标签。”
http://www.crockford.com/html/
这里的关键是，HTML基于SGML。与具有文档类型和模式的XML不同，如果浏览器不知道某个标记或两个标记，则HTML不会变为无效。想想<marquee>。它并没有出现在官方标准中。因此，虽然使用它会使您的HTML页面“非正式未批准”，但它仍然不会破坏页面。
接下来是<keygen>，它是Netscape专有的，在HTML4中被遗忘了，现在在HTML5中重新发现并指定。现在我们也有自定义标记属性，例如在所有HTML5标记上允许data-XyZzz =“...”。
因此，虽然您不应该发明自己完整的自定义未指定标记，但在HTML中拥有自定义标记并不完全是禁止的。但是，除非您希望将其与+xml内容类型一起发送或嵌入其他XML命名空间（例如SVG或MathML），否则适用于仅限于SGML的HTML。
<a>标签是指向另一个页面的链接。你可以创建自己的标记语言，但除了你自己以外，其他人不会理解其中的含义。对于某个特定目的来说，这可能没问题，但那时你就不再真正使用HTML了。 - Paul D. Waite自定义标签可以在Safari、Chrome、Opera和Firefox中使用，至少可以将它们用作替代“class =…”。
在CSS中，green {color: green}适用于
<green>This is some text.</green>
在HTML中创建自定义标签名称是不可能的/无效的，这也是XML、SGML和其他常规标记语言存在的原因。
你可能想要的是：
<div id="menu">
<div id="lunch">
<span class="dish">aaa</span>
<span class="dish">bbb</span>
</div>
<div id="dinner">
<span class="dish">ccc</span>
</div>
</div>
或者使用类似于<ul/>和<li/>的标签来替代<div/>和<span/>。
为了让它看起来和运行得更好，只需连接一些CSS和Javascript。
<head>
<lunch>
<style type="text/css">
lunch{
color:blue;
font-size:32px;
}
</style>
</lunch>
</head>
<body>
<lunch>
This is how you create custom tags like what he is asking for its very simple just do what i wrote it works yeah no js or convoluted work arounds needed this lets you do exactly what he wrote.
</lunch>
</body><lunch>标签包含在标准中，以引发披萨的气味（默认），而你正在为一家克里奇餐厅设计页面。为了避免麻烦，请使用<main-dish>（两个单词）。 - undefined若要嵌入元数据，你可以尝试使用HTML微数据，但这比使用类名更冗长。
<div itemscope>
<p>My name is <span itemprop="name">Elizabeth</span>.</p>
</div>
<div itemscope>
<p>My name is <span itemprop="name">Daniel</span>.</p>
</div>
最后，虽然我已经有几年没有尝试过这种方法，但我的回忆是IE（至少是几个版本之前）拒绝直接将CSS样式表应用到XML文档中。
div元素来解决。 - geowa4