是否需要 h2 标签的隐式样式，即使它的父 div 已经设置为居中对齐？

Question

这是我的HTML代码（我正在练习HTML！）和CSS文件：

/*styling the child, descendants*/


/*Individual selectors*/

* {
  margin: 0;
  padding: 0;
}

body {
  background-color: #DC836F;
  font-family: century, times, sans-serif;
  font-size: 12px;
  /*base size*/
}


/*group selectors*/

body h1,
h2 {
  margin: 10px 5px;
  padding: 10px 5px;
  font-family: Courier New;
  color: #76565C;
}

.primary-class,
.secondary-class {
  border: solid 15px;
  border-color: #DC836F;
  margin: 5% 10%;
  padding: 2% 2%;
  text-align: center;
}


/*Descendant selectors*/

body h1 {
  font-size: 3em;
  font-weight: 800;
  text-align: center;
}

body h2 {
  font-size: 2em;
  font-weight: 600;
  text-align: justify;
}

body h1 em {
  color: #E0C1A5;
  font-weight: 700;
  font-family: monospace;
}

.primary-class {
  background-color: #E0C1A5;
  font-family: Trebuchet MS;
}


/*********************MY DOUBT IS HERE***********************/


/*
.primary-class h2{
    text-align: inherit;
}*/

<!DOCTYPE html>
<html>

<head>
  <title>Learn:Descendant selector</title>
  <link href="style-descendant-selectors.css" rel="stylesheet">
</head>

<body>
  <h1>Welcome to learning about <em>inheritance</em></h1>

  <h2>This was supposed <em>to be for fun!</em></h2>

  <div class="primary-class">
    <h2>Primary class block</h2>
    <p>In this section we <em>styled</em> the entire block using <strong>bold texts</strong></p>
  </div>
  <div class="secondary-class">
    <h2>Secondary class block</h2>
    <p>In this section we <strong>styled</strong> the entire block using <em>italicised texts</em></p>
  </div>
  <div class="primary-class">
    <h2>Primary class block</h2>
    <p>In this section we <em>styled</em> the entire block using <strong>bold texts</strong></p>
  </div>
  <div class="secondary-class">
    <h2>Secondary class block</h2>
    <p>In this section we <strong>styled</strong> the entire block using <em>italicised texts</em></p>
  </div>
</body>

</html>

我的问题：

我在 <div class="primary-class> 中有一个 <h2> 标签。（请参考html代码）我用 text-align: center; 设计了 <div class="primary-class> 所以，如果我们按照上面提到的样式设置样式，那么我应该看到 <div class="primary-class> 中的所有内容都居中对齐了吗？
如果对上述问题的回答是是，那么h2标签 我在其中使用的 div 应该是 居中对齐的吧？但它并没有发生:

我不得不隐含地删除 div 中的 h2 标签，以使其居中对齐，如下所示：

.primary-class h2{
    text-align: inherit;
}

现在标签似乎居中对齐了。但它应该默认继承了

一个 h2 元素默认有 text-align: inherit ，但你有：

body h2 {
  text-align: justify;
}

... 所以文本是对齐的，而不是从 <div class="primary-class">

继承它的对齐规则

使用浏览器中的开发人员工具检查器查看元素应用了哪些规则：

是否需要 h2 标签的隐式样式，即使它的父 div 已经设置为居中对齐？

is implicit styling of h2 tag required even if its parent div is already styled to center align?

html

css

css-selectors