Html 仅增加元素子元素的字体大小

我正在使用rems设置字体的大小，在某些断点处，我想缩放字体的大小，但不是整个页面，而是特定容器中的文本。我知道，如果我更改

html

的字体大小，它将更改页面上所有元素的大小，但是我如何才能只更改特定容器（例如

.container

中的子容器）中的大小，这可能吗我希望将容器作为一个整体进行缩放，而不是为每个子容器指定大小。：

CSS

html{
    font-size: 13px;
  }

  p{
    font-size:1rem;
    }

h1{
font-size:2rem;
}

.container{
   font-size:3rem;
}

HTML

<h1>Main title</h1>
<p>Main text</p>

<div class="container">
  <h1>Title</h1>
  <p>Text</p>
</div>

主标题
正文

标题
正文

像这样尝试：

.container h1{
     font-size:3rem;
     color:red;
}

---

通过执行以下操作，您可以在特定的

.container

中设置特定的

：

.container p {
    font-size:10px;
}

.container2 p {
    font-size:15px;
}

---

每个容器中的字体大小将不同。

使用

选择器*

以所有子容器为目标：

html{
字体大小：13px；
}
p{
字号：1rem；
}
h1{
字号：2rem；
}
.集装箱*{
字体大小：12px；
颜色：红色；
}

主标题
正文

标题
正文

你想在

容器中设置的字体大小吗？你是否尝试过
容器h1、.container p
？是的，我当然尝试过，但我不想单独设置每个孩子，而是将容器缩放为整个
。容器*
作为你的选择我当然尝试过了，但是我不想单独设置每个孩子，只是将容器作为一个整体进行缩放。当然，我试过了，但我不想单独设置每个孩子，只是将容器作为一个整体进行缩放。sideroxylon在问题评论中说。