css - 设置 css 元素时引用父级

Question

我在页面之间共享了这个 CSS，我只想在其中一个页面上做一些填充更改，其余部分仍然相同。

我可以通过为我正在使用的页面创建一个特殊的类来做到这一点，但我想问一下是否有一种巧妙的方法可以通过在页面的顶部父级上添加条件来处理它？

需要更改:如果页面中的顶级父级有一些 id/class name .. padding-top: 60px 而不是 30px，否则保持 30px

#box-list {
  padding-top: 10px;

  @media (min-width: @screen-md-min) {
    padding-top: 30px;
  }
}

Answer 1

如果我是对的，这将起作用。

唯一的条件是 #box-list 的父级有一个 id #your-special-page。

#box-list {
  padding-top: 10px;

  @media (min-width: @screen-md-min) {
    padding-top: 30px;

    #your-special-page & {
      padding-top:60px;
    }
  }     
}