html - 为什么样式没有应用到这个例子中的子元素？

Question

例如:

我有一个 li 的子元素:

<li class="element1">
    <p>Heading</p>
     ...
     ...
     ...
</li>

我想将以下样式应用于 p。我尝试使用以下 CSS 代码执行此操作。

li.p {
    font-style: bold;
    text-align: left;
}

这行不通，所以我尝试另一种方法。我将“标题”类添加到 p 元素。然后，我将尝试应用于 li.p 的相同样式写入 #heading 类。

还是不行。这是为什么？

Answer 1

你写的 CSS 就好像 p是一个类( li.p 会为 <li class="p"> 的元素设置样式)，所以去掉句号，它应该是

li > p {
  // Style here
}