Question

我希望最后一个孩子（7777） border top显示无。

我试过了，但我无法得到请给我解决方案。

仅通过css

CSS
 .common.true{
  display: block;
   border-top: 1px solid red;
 }
 .common{
 display: none;
 }
 .true:last-child{
 border-top: none;
 }

我不希望显示最后一个子边框。但不使用第n个孩子。其他方式

Answer 1

首先，如果你显示：没有最后一个元素，那么你如何在该元素上使用css（隐藏元素）。

如果你想让Id或class（属性）对它执行操作，你应该选择js或jquery。

第二件事，最后一个孩子将是8888，但你想要做第二个最后一个孩子，然后使用它，它可能有用：

.common:nth-last-child(2){
        border-top:none !important;
     }`enter code here`

Answer 2

HTML中存在一个基本错误。您的HTML中的最后一个孩子是8888，并且您想要隐藏7777的border-top。使用以下内容：

<div id="my-section">
    <div class="common true">1111</div>
    <div class="common">2222</div>
    <div class="common true">3333</div>
    <div class="common true">4444</div>
    <div class="common true">5555</div>
    <div class="common true">6666</div>
    <div class="common true">7777</div>
    <div class="common">8888</div>
</div>
.common.true{
      display: block;
       border-top: 1px solid red;
}
.common{
    display: none;
}
.true:last-child{
    border-top: none;
}
#my-section .common:nth-last-child(2){
    border-top:none !important;
    }

我添加了一个新的css选择器，它隐藏了第二个孩子的边框。

如果我给最后一个元素显示none，如何选择最后一个div？

2 个答案: