p中div -- a中a

今天查看W3CSCHOOL官网，在测试一些属性的时候把div放到了p元素中。然后出现了一个奇怪的现象。

HTML：

<p>
    <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. </div>
</p>

浏览器解释HTML：

<p></p>
    <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. </div>
<p></p>

 摘要：段落p标签的用法   

         可以只在块（block）内指定段落，也可以把段落和其他段落、列表、表单和预定义格式的文本一起使用。总          的来讲，这意味着段落可以在任何有合适的文本流的地方出现，例如文档的主体中、列表的元素里，等等。

         从技术角度将，段落不可以出现在头部、锚或者其他严格要求内容必须只能是文本的地方。实际上，多数浏            览器都忽略了这个限制，它们会把段落作为所含元素的内容一起格式化。

我们知道span中可以包含span

<span>
    123
    <span>456</span>
</span>

然而对于a元素来说，也会出现怪异现象

我们知道a元素可以包含块级元素

<a href=“#”>
  <div>这是一个DIV </div>   
</a>

然而a不可以包含a 

HTML：

<a>123<a>456</a></a>

浏览器解释HTML：

<a>123</a>
<a>456</a>

对于p中包含div和a中包含a出现截断问题，我们平时在编写代码是应该注意下，避免出现这类问题。

 

转载于:https://www.cnblogs.com/zmr2520/p/5301885.html