1

我有一个部分，其中有一个来自数据库的重复 div，其中有一个 hr 将它们分开，但我需要隐藏列表中的最后一个。

所以我的html看起来像这样。

<div class="container">
  <div class="reply">
    <p>wonderful paragraph</p>
    <hr>
  </div>
  <div class="reply">
    <p>wonderful paragraph</p>
    <hr>
  </div>
  <div class="reply">
    <p>wonderful paragraph</p>
    <hr>
  </div>
</div>

我尝试了几种不同的方式来定位最后一个孩子，但我似乎无法做到正确。

.container:last-child .reply hr{
  display:none;
}

.reply:last-child hr{
  display:none;
}

.container .reply:last-child hr{
  display:none;
}

任何帮助都会很棒！

我的 hr 风格

.reply hr{
  border: 0;
      height: 1px;
      background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.15), rgba(0,0,0,0)); 
      background-image:    -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); 
      background-image:     -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); 
      background-image:      -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0)); 
  margin:0;
}
4

5 回答 5

3

使用这个——它会隐藏你的最后一个回复 div：

jQuery(".reply").last().hide();
于 2015-06-08T21:14:31.877 回答
2

最后一个和倒数第二个将起作用。当他们选择reply. container然后<hr>将隐藏此容器内的内容。

.reply:last-child hr {
    display:none;
}

.container .reply:last-child hr {
    display:none;
}

演示

先试后买（版本 1）

先试后买（第 2 版）

第一个

.container:last-child .reply hr {
    display:none;
}

<hr>如果div.container是其父元素的最后一个子元素，则将隐藏所有元素。

于 2013-09-06T18:15:57.790 回答
0

在这里演示

div.reply:last-child hr{display:none;}
于 2013-09-06T18:18:57.170 回答
0 
.container .reply:last-child hr {
    display: none;
}

抓住最后一个.reply并隐藏其中的任何hr元素。

演示：http: //jsfiddle.net/9HNNU/

于 2013-09-06T18:14:10.007 回答
0 
.container .reply:last-child hr {display:none;}

首先选择最后一个重复的 div，然后选择它的子 hr 标签并在该元素上显示 none。如果每个重复的 div 中有多个 hr 标签，您可以在 hr 选择器中添加一个额外的 last-child 伪类。

小提琴：http: //jsfiddle.net/NuuAa/

于 2013-09-06T18:23:20.313 回答