javascript - 覆盖 :first-child pseudo class styling using jquery

Question

我需要使用 jQuery 覆盖我的样式表中定义的已定义 :last-child 样式。我的目标是使用 css 和 jQuery 的组合来实现最小标记，其中围绕“容器内容”的结构附加到文档就绪的 div。

<div id="title-some-impact"><!--Vertical container title--></div>
   <div class="container-content-wrapper">
         <div></div>
         <div class="container-content"><!--Actual container content-->
            <div class="sub-container-content"></div>
         </div>
         <div style=""></div>
   </div>
   <div style="clear: both;"></div>
</div>

我使用 container-content-wrapper 中的第一个和最后一个 div 来使用 css 添加圆 Angular ，如下所示:

.container-content-wrapper>div:first-child {  /* rounded corners top */
    width: 930px;
    height: 16px;
    background: url(../Images/top-rounded-corners.png) top no-repeat;
}

.container-content-wrapper>div:last-child { /* rounded corners bottom */
    width: 930px;
    height: 33px;
    background: url(../Images/bottom-rounded-corners.png) top no-repeat;
}

在某些情况下，我需要使用 jQuery/JavaScript 更改底部背景图像，但到目前为止都失败了。

我试过使用: $('.container-content-wrapper>div:first-child').css('background', 'some other link');此外，添加另一个指向另一个图像的类也不起作用。

如何使用 jQuery 覆盖样式表中定义的已定义 :last-child 样式？

Answer 1

$('.container-content-wrapper>div:first-child').css('background', 'some other link');

该选择器适合您的标记。它将选择第一个 div，它是 .container-content-wrapper 的直接上级。所以这不是你的问题。

CSS 选择器没有引用 jQuery 选择器，因此您不能“覆盖”它们。看起来你的一些其他链接在这里是错误的。