CSS类命名约定.sa列表li a>div{..}

我正在看一个CSS示例，它的代码如下：

.sa-list li label > span,
.sa-list li h3 > span,
.sa-list li h4 > span,
.sa-list li a > div{
    position:relative;
    display:table-cell;
    vertical-align:middle;
    padding:10px 20px;
}

有人能解释一下li、a和div之间的关系以及哪种样式适用于哪里吗？

这些规则都设置了一个跨度，它是标签的直接子级，h3和h4，以及一个div，它是a标记的直接子级，它们都是li的后代，也是sa list类元素的后代

例如：

<ul class="sa-list">
  <li>
    <label>
      <span><!-- this span is styled --></span>
    </label>
  </li>
</ul>

<div class="sa-list">
  <ul>
    <li>
      <div>
        <h4>
          <span><!-- this span is also styled --></span>
        </h4>
      </div>
    </li>
  </ul>
</div>

<ul class="sa-list">
  <li>
    <a>
      <div><!-- this div is styled --></div>
      <div><!-- as is this div --></div>
      <section>
        <div><!-- this div is not, b/c it is not a direct child of the a --></div>
      </section>
    </a>
  </li>
</ul>

---

当a>b时，a是b。a是李的后裔，div是a的直系子女。“作为祖先父亲\儿子：”哈希姆，解释说，完完全全。为了进一步的信息：HasHimqulaMy谢谢，这是很好的解释…来吧。请否决这个问题我只有17个代表！我真的找了这么多，没有偷懒。