Question

我想在课程 fancybox-inner 上应用Css，这是主要内容类的最后一位。我不想直接定义类并应用属性。因为我有多个同名的类，即 fancybox-inner 。所以我想代表主要内容定位 fancybox-inner 。

HTML：

<div class="fancybox">

 <div class="fancybox-inner">

    <div class="main-content">

      <!--- Some Content ------>

    </div>

 </div>

<div>

到目前为止我尝试了什么：

  .main-content < .fancybox-inner {
      width:1000px !important;
  }

Answer 1

使用：nth-last-child（）选择器

http://www.w3schools.com/cssref/tryit.asp?filename=trycss3_nth-last-child

更新回答

.main-content:parent {//specify properties for fancybox-inner here}

Answer 2

Is there a CSS parent selector?

很抱歉，但是没有办法按照你的要求这样做。

可能的解决方案是走另一条路。

.fancybox .fancybox-inner {
    // CODE HERE
}

这将定位fancybox类，然后定位fancybox-inner（它将仅定位在fancybox类中的那个）

希望这有帮助。

Answer 3

您可以为该元素添加一个额外的类

<div id="mywrapper">
<div class="fancybox">

 <div class="fancybox-inner extra-class">

    <div class="main-content">

      <!--- Some Content ------>

    </div>

 </div>

</div>
</div>

然后你的css将是：

 #mywrapper > fancybox >fancybox-inner {
      width:1000px !important;
  }

Answer 4

您可能希望使用jquery访问父节点并将css应用于该节点。可能就像，

$(".main-content").parent().css({'width':'1000px !important'});

Answer 5

您可以使用wrapCSS属性设置自定义类

$(".selector").fancybox({
    wrapCSS : 'my-custom-css-class'
});

将Css应用于Last Parent Div

5 个答案: