編輯問題，以包括預(yù)期行為、特定問題或錯(cuò)誤以及重現(xiàn)問題所需的最短代碼。這將有助于其他人回答問題。

使用next元素~這樣兩個(gè)連續(xù)的條目div就不會(huì)有HIDE類來顯示邊框。

.item {
  height: 50px;
  text-align: center;
  vertical-align: middle;
  line-height: 50px;
}

.item:not(.hide) ~ .item:not(.hide) {
  border-top: 1px solid red;
}

.item.hide {
  overflow: hidden;
  height: 0;
}

<div class="container">
  <div class="item hide">Item 1</div>
  <div class="item hide">Item 1</div>
  <div class="item ">Item 1</div>
  <div class="item hide">Item 1</div>
  <div class="item hide">Item 1</div>
</div>

如果您想保留隱藏div，我們可以簡(jiǎn)單地移除它們的邊界，但這會(huì)在最后一個(gè)可見元素處留下一個(gè)分隔線

.item { 
    height: 50px;
    text-align: center;
    vertical-align: middle;
    line-height: 50px;
}

.item:not(:first-child) { 
    border-bottom: 1px solid red;
}


.item.hide {
    overflow: hidden;
    height: 0;
  border: none;
}

<div class="container">
    <div class="item hide">Item 1</div>
    <div class="item hide">Item 1</div>
    <div class="item ">Item 1</div>
    <div class="item hide">Item 1</div>
    <div class="item ">Item 1</div>
    <div class="item hide">Item 1</div>
</div>