html - 当 div 使用 css 有第二个 child 时删除第一个 child 填充

Question

我在一个 div 中有两个 anchor 标记。我只想在 div 有一个 anchor 标记时应用填充样式。例如第 2 组，不应显示填充

.email a {
  padding-top:10px;
  display: block;
} // for set 1

//I need to remove padding for a tag when div having two a tag like set 2

    Set 1:
    <div class="email">
      <a href="#">Hello</a>
    </div>
    Set 2:
    <div class="email">
      <a href="#">Hello</a>
      <a href="#">Hello</a>
    </div>

Answer 1

使用 only-child选择器:

.email a {
  display: block;
}

.email a:only-child {
  padding-top: 10px;
}

Set 1:
<div class="email">
  <a href="#">Hello</a>
</div>
Set 2:
<div class="email">
  <a href="#">Hello</a>
  <a href="#">Hello</a>
</div>