如何删除最后一行中的margin-bottom？

Question

我有我的标签集合：

如何关闭第3行底部的边距或标签是100还是200或300？

代码示例：

我创建标签的集合。可能是1个元素或更多。

<div class="collection">
  <div class="tag">1</div>
  <div class="tag">2</div>
  <div class="tag">3</div>
  <div class="tag">4</div>
  <div class="tag">5</div>
  <div class="tag">6</div>
  <div class="tag">7</div>
  <div class="tag">8</div>
  <div class="tag">9</div>
  [...or more]
  <div class="footer">
    footer
  </div>
</div>

SASS示例

.collection
  width: 900px;
  margin: 0 auto;
  border: 1px solid black;
  display: flex;
  flex-wrap: wrap;
  padding: 20px; 
 
.tag
  width: 300px;
  box-sizing: border-box;
  padding: 10px 20px;
  border: 1px solid black;
  margin-bottom: 10px;
  
.footer
  margin-top: 30px;
  background: blue;
  width: 900px;
  color: white;
  padding: 30px;

Answer 1

请尝试

nth-child用于在标记7 至标记9

之间进行选择

.tag:nth-child(n+7):nth-child(-n+9){
  margin-bottom: 0 !important;
 }

.collection{
  width: 900px;
  margin: 0 auto;
  border: 1px solid black;
  display: flex;
  flex-wrap: wrap;
  padding: 20px; 
 }
.tag{
  width: 300px;
  box-sizing: border-box;
  padding: 10px 20px;
  border: 1px solid black;
  margin-bottom: 10px;
 }
 .tag:nth-child(n+7):nth-child(-n+9){
  margin-bottom: 0 !important;
 }
.footer{
  background: blue;
  width: 900px;
  color: white;
  padding: 30px;
  }

<div class="collection">
  <div class="tag">1</div>
  <div class="tag">2</div>
  <div class="tag">3</div>
  <div class="tag">4</div>
  <div class="tag">5</div>
  <div class="tag">6</div>
  <div class="tag">7</div>
  <div class="tag">8</div>
  <div class="tag">9</div>
  
  <div class="footer">
    footer
  </div>
</div>

Answer 2

您始终可以在第3行的元素上使用以下标记。 底边距：0;
如果不清楚，请分享更多详细信息/您的代码。