CSS对某些部分不起作用，但对其子部分起作用

<style>
  .parent {
    color: red;
  }
  .child {
    color: blue; /* 优先级高于.parent */
  }
</style>
<div class="parent">
  Parent Text
  <div class="child">Child Text</div>
</div>

#parent {
  color: red; /* 使用ID选择器提高优先级 */
}

<style>
  .parent {
    font-size: 16px;
  }
</style>
<div class="parent">
  Parent Text
  <span>Child Text</span> <!-- span默认继承font-size -->
</div>

.parent {
  font-size: 16px;
  color: red; /* 明确设置颜色 */
}

<style>
  .parent {
    color: red;
  }
  div.child {
    color: blue; /* 特异性更高 */
  }
</style>
<div class="parent">
  Parent Text
  <div class="child">Child Text</div>
</div>

.parent > div {
  color: red; /* 直接子元素选择器 */
}

<style>
  .parent {
    color: red;
  }
</style>
<style>
  .child {
    color: blue !important; /* 使用!important强制覆盖 */
  }
</style>
<div class="parent">
  Parent Text
  <div class="child">Child Text</div>
</div>