我总是会说不，但后来我从语义UI(和语义UI)，一个非常流行的前端框架中看到了这段代码:
<h2 class="ui icon header">
<i class="settings icon"></i>
<div class="content">
Account Settings
<div class="sub header">Manage your account settings and set e-mail preferences.</div>
</div>
</h2>
这段代码让我觉得很不寻常，有两个原因:(1)<i>标签被重新用作图标的通用钩子，(2)<h2>元素内部有嵌套的<div>。我质疑前者的语义，以及后者的有效性。
我想这段代码可以在所有主流浏览器中工作，否则他们就不会使用它了，但它似乎不太习惯。更重要的是，它是否有效?
注意:我在问题中使用了术语"块级元素"(每个人都理解)，但正如MDN文档指出的:
HTML中使用了块级元素和内联元素的区别规格高达4.01。在HTML5中，这种二元区分是替换为一组更复杂的内容类别。而"内联"范畴大致对应于的范畴措辞内容,"block-level"类别并不直接对应于任何HTML5内容类别，但block-level"one_answers";inline"元素相结合在一起对应于流内容在HTML5。
这是很讨厌的代码，完全不符合规范。在一个h2里面你只能有内联元素短语内容元素如span、strong、em等。<i>标签通常用于图标，所以这没什么令人震惊的。但是潜水…?令人震惊的是坏的。将它们切换为<span>，代码将有效。
下面是h1、h2等可以包含的内容的官方规范。所谓的"措辞内容":https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#phrasing_content
编辑:MDN不是官方规范，正如原海报在评论中指出的那样。然而，它是基于官方规范的。HTML的权威来源应该是来自Web超文本应用技术工作组(WHATWG)的HTML生活标准。它们提供了关于措辞、内容和标题(h1-h6)的良好信息。
HTML来源于SGML，它被设计用来标准化纸质文档的布局。在这个逻辑中，标签H1到H6是针对不同级别的标题制作的，所以简单地说标题就是一种广告，必须简短。
因此，原则上，H标签不应该包含层次信息。
而且，div标签在SGML中不存在，在早期的HTML版本中也不存在。DIV标签是微软用来取代LAYER标签的，LAYER标签是为了消除IE以外的其他浏览器而采取的许多策略的结果。这个故事是众所周知的，微软也因为其中的一些事实而受到谴责。
根据HTML5规范，这是无效的…但是许多UI库并没有遵循这种严格的语义方式，甚至Google也在其HTML5 Doctype的主页上使用<center>标签。所以这不是一个"必须"，也许只是一个"应该"……遵循规范是一个很好的实践，但开发人员不应该在这方面投入太多精力。
另外，检查html标记的有效性是google的惯例，请查看下面的链接…https://validator.w3.org/nu/textarea