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

Question

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

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

并在 CSS 中我设置

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

字体大小感觉不像 60px，它看起来像是 80px+ 大小，但是当以不同的方式重写它时：

h2, span{ font-size: 60px}

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

Answer 1

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

对于span，是的，确实如此。这是因为span是一个通用元素。从 MDN 文档页面的span元素：

HTML 元素是用于措辞内容的通用内联容器，它本身并不表示任何内容。

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

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