CSS选择器之间的关系

父子选择器

父子选择器，定义时，子选择器可以直接位于父选择器内，如方式1；子选择器也可以用 > 方式进行定义，如方式2。

// 方式1：
.parent {
  overflow-x: scroll;
  overflow-y: hidden;
  white-space: nowrap;
  padding-bottom: 0.6em;

  .child {
    height: 1.8em;
    width: 2.8em;
    margin: 0.1em;
  }
}

// 方式2
.parent > .child {
  height: 1.8em;
  width: 2.8em;
  margin: 0.1em;
}

注意，子元素仅指父元素的直接后代，即第一代子元素，使用方式是嵌套，对类名并列的使用方式无效：

<!--嵌套：-->
<div class="parent">
	<div class="child"></div>
</div>

<!--并列：-->
<div class="parent child"></div>

---

未完待续