場景是實現
多段的兄弟元素的第一個添加間距 如:
<c></c>
<a class='test'></a>
<a class='test'></a>
<a class='test'></a>
<a class='test'></a>
<b></b>
<b></b>
<a class='test'></a>
<a class='test'></a>
<a class='test'></a>
<a class='test'></a>
.test {
margin-top:30px;
}
.test + .test {
margin-top:0;
}
如
<c></c>
<a class='test'></a>
<x></x>
<a class='test'></a>
<x></x>
<a class='test'></a>
<a class='test'></a>
<b></b>
<b></b>
<a class='test'></a>
<x></x>
<a class='test'></a>
<x></x>
<a class='test'></a>
<a class='test'></a>
如相鄰兄弟元素中間還有其他元素則
.test {
margin-top:0;
}
c + .test, b + .test{
margin-top:30px;
}
不存在多段只設置第一個的話可以通過~選擇符
.test {
margin-top:30px;
}
.test ~ .test {
margin-top:0;
}