div 中的最后一个子选择器答案

【问题标题】：last child selector in divdiv 中的最后一个子选择器
【发布时间】：2015-06-14 23:06:52
【问题描述】：

我有一个父 div 和 3 个 div。我想隐藏最后一个子 div。我尝试使用last-child CSS 选择器，但它不起作用。

div的顺序：

<div class="wysibb-toolbar">
    <div class="wysibb-toolbar-container"></div>
    <div class="wysibb-toolbar-container"></div>
    <div class="wysibb-toolbar-container">//(This is to be made display:none)
        <div class="wysibb-toolbar-btn wbb-code" jQuery110208619481903000815="71"></div>
        <div class="wysibb-toolbar-btn wbb-code" jQuery110208619481903000815="71"></div>
    </div>
</div>

我试过这个：

div.wysibb-toolbar div:last-child {
    display:none;
}

【问题讨论】：

您的 CSS 属性中有错字。这是display，而不是disply。如果这样可以解决您的问题，我建议您删除您的问题以避免投票/问题关闭。如果它不能解决您的问题，那么我们需要查看更多代码，因为 display: none; 对我来说适用于该 HTML。
啊，抱歉更正了类型。但这仍然不起作用
你确定这些是你真正的标记吗？
是的 Fabrizio，从开发人员工具中复制了标记。我无权访问生成 Jquery 或 UI 的 HTML 文件。可以通过使用css文件覆盖类来修改UI。所以寻找另一种选择..
last-child of div class的可能重复

标签： html css

【解决方案1】：

你的问题是你打错了display这个词，拼错了disply

试试这个

div.wysibb-toolbar div:last-child {
  display: none;
}

<div class="wysibb-toolbar">
  <div class="wysibb-toolbar-container">Test 1</div>
  <div class="wysibb-toolbar-container">Test 2</div>
  <div class="wysibb-toolbar-container">Test 3 (should be hidden)</div>
</div>

【讨论】：

这似乎只是一个错字；此后，OP 编辑了他的问题以添加缺少的“a”。
更正了错字。还是行不通。最后一个 div 里面有两个由 jquery 生成的 div。更新了代码。代码是否由于 jquery 而失败？对不起，如果我太天真了。
我无权访问生成 Jquery 或 UI 的 HTML 文件。可以通过使用 css 文件覆盖类来修改 UI。所以寻找另一种选择......

【解决方案2】：

试试这个

div.wysibb-toolbar>div:last-child {
    display:none;
}

或者只是

div.wysibb-toolbar-container:last-child{
 display:none;
}

或更通用的

div.wysibb-toolbar>div.wysibb-toolbar-container:last-child{
 display:none;
}

【讨论】：

【解决方案3】：

:last-child 选择器匹配其父元素的最后一个子元素。试试这个JSFIddle

 .wysibb-toolbar-container:last-child {
    display:none; 
  }

【讨论】：