HTML标签嵌套规则

看了网上有各种相关的总结，所以我就不再重复粘贴复制，只是把比较容易犯错的整理一下（内容越少越容易看到重点哈，想要看详细的，我下面有附链接）

规则如下：

• 内联元素不要嵌套块元素（虽然浏览器可能可以正常解析，但是尽量不要这样使用，一方面是遵守代码规范，另外可能会引起意想不到的错误）
• 一些块元素不能嵌套块元素（h1、h2、h3、h4、h5、h6、p、dt不能包含块级元素）注意：p元素嵌套任何块级元素都一定会被浏览器错误解析

P标签内包含块元素时，它会先结束自己，比如：<p><div>donna</div></p>

那么浏览器会解释成：<p></p><div>donna<*/div><p></p>  会多解释出一个p

• <a>元素不可以嵌套<a>元素（但a元素可以嵌套其他的内联元素）：a元素嵌套a元素会导致所有浏览器解析错误

比如<a href="#"><a href="#">leo</a></a>

浏览器会解析成：<a href="#"></a><a href="#">leo</a>

• 内联元素可以包含内联元素（除了上面我们说的a标签不能在包含a标签）

目前我知道的，除了p标签一定不能嵌套p标签，a标签一定不能嵌套a标签，其它的，貌似没有没有那么严格，但是我们尽量还是要遵守html代码嵌套规范，避免造成难以预料的错误（我知道的是react中如果p标签嵌套了块级元素浏览器是会报错的）

HTML嵌套规范我看到的可以参考的链接地址有：

http://www.softwhy.com/article-33-1.html

https://www.cnblogs.com/xiyangbaixue/p/4090511.html

https://www.cnblogs.com/Iona/p/4732452.html