html - CSS 中的文本对齐继承

Question

我有一个包含 div 和一些 CSS 规则的 HTML 结构。我想知道为什么 text-align:centre 被继承到它的子 div 以及为什么只有 text-align:centre 被继承

.multi {
  width: 500px;
  text-align: center;
  float: left
}

<div class="multi">
  <div class="rr">Abc</div>
</div>

Answer 1

在 CSS 中，有些属性是自然继承的，默认情况下。 text-align是其中之一，还有 font、color 等。 Here是一个相当小的(但大部分是健壮的)属性列表，这些属性将不会由 child 继承。

在这种情况下你必须做的是这样的:

<style>
.multi {
    width: 500px;
    text-align: center;
    float: left;
}
.multi .rr {
    text-align: left; /* Or whatever value multi's parent has */
}
</style>