Html css选择器：另一个类中的类不工作

我在某个地方读到，另一个类中的一个类是这样写的： .class1.class2{style}。 但我发现它不起作用

例如：

<style>
h1 p {
    background-color: yellow;
}
.a1 .a2{
     background-color: green;
}
</style>

<h1><p>Welcome to My Homepage</p></h1>

 <p class="a1">
   <p class="a2"> My name is Donald  </p> 
   <p class="a3"> I live in Duckburg.</p>
 </p>

H1P{
背景颜色：黄色；
}
.a1.a2{
背景颜色：绿色；
}
欢迎来到我的主页


我的名字是唐纳德
我住在达克伯格

正如你所看到的，下面应该是绿色的。但事实并非如此

<p class="a1"><p class="a2"> My name is Mike  </p> </p>

我的名字是迈克

---

我在这里遗漏了什么吗？

您不能嵌套

元素。段落只能包含

将外部段落更改为

，将正确应用样式：

h1p{
背景颜色：黄色；
}
.a1.a2{
背景颜色：绿色；
}

欢迎来到我的主页

我的名字是唐纳德
我住在达克伯格

这不是CSS的问题，而是HTML的问题： 您将一个

标记嵌套在另一个

标记中

看

---

也许您可以尝试将

更改为

？

您不能将p嵌套在p中。它是非法的。或者在h1中嵌套一个p…我不相信它是重复的，因为这个特定的问题以前从未被问过。这个问题本身可以使其他可能和我有同样疑问的人受益。