在<p> </ p>中嵌套<ul> </ ul>会创建两个段落.为什么？

Question

我注意到浏览器如何解释以下代码的奇怪行为:

  <h2>Maecenas aliquet lorem id urna vehicula</h2>
  <p>&nbsp;
    <ul class="liststyle">
      <li>Curabitur</li>
      <li>Pharetra</li>
      <li>Convallis</li>
    </ul>
  </p>

当我尝试给这个样式时,我尝试了以下选择器:

p li {
  font-family: Verdana, sans-serif;
  font-size: 14px;
}

我知道更好的选择是"ul li",但我的选择器(p li)应该可以工作而不是,所以在Chrome和Firefox中查看开发人员工具,这就是他们解释代码的方式:

<p>
</p>
<ul class="liststyle">
    <li>Curabitur</li>
    <li>Pharetra</li>
    <li>Convallis</li>
</ul>
<p></p>

唯一的区别是Chrome还会显示我尝试解决问题的实体( ),但仍会创建两个段落.我正在寻找这种现象的解释.谢谢.

Answer 1

段落可能不包含块级元素.有些浏览器显然认为你犯了一个错误并试图纠正它.

阅读更多