如果元素由其 class 定义，则字体大小不正确

Question

我正在制作一个项目，我必须更改元素的字体大小并且它的工作方式不同。 例如，我有一个代码

<div class="text-area-1">
            <h2>We are <span class="span1">Newbie</span></h2>
</div>

在 CSS 我设置

text-area-1{
  font-size:60px;}

font-size 感觉不像 60px，它看起来像是 80px+ 大小，但是当重写时不同：

h2, span{ font-size: 60px}

现在它真的是 60px。有人能解释一下，为什么会这样吗？ 将属性设置为父（div）不会为其他子（h2，span）设置相同的属性吗？

Answer 1

将属性设置为父（div）不会为其他子（h2，span）设置相同的属性吗？

对于span ，是的。 那是因为span是一个通用元素。 从span元素的MDN 文档页面：

HTML 元素是用于短语内容的通用内联容器，它本身并不代表任何内容。

因此，跨度没有为其定义特定的字体大小，并且它从其父级继承其字体大小。

但是h2在浏览器的默认样式表上定义了一定的字体大小（除了一些其他 SEO 目的之外，这是标签的全部点）。 当一个元素直接应用了 styles 时，它不再从其父元素继承此属性。