使用Bootstrap的类作为mixins时应用嵌套的选择器规则

时间:2016-02-10 22:07:25

标签: css twitter-bootstrap less

我正在使用带LESS的Bootstrap,并希望将BS类“隐藏”在我自己的,更多语义的背后。

例如,如果我想将<li>元素显示为BS面板,我的LESS可能会有这样的结果:

 ul.main-item-list {

     list-style:none;
     margin:0;
     padding:0;

     > li {
         .panel;
         .panel-default;
         margin:40px 0;

         > .item-heading {
             .panel-heading;
         }

         > .item-body {
             .panel-body;
         }

         > .item-footer {
             .panel-footer;
         }
     }
 }

单独应用每个样式规则。

但是(显然,当你考虑它时)没有应用嵌套的选择器规则:

.panel-default > .panel-heading {

    // styles normally associated with this rule are not being applied

}

是否可以在我自己的类中使用bootstrap类作为mixins,这样嵌套的选择器规则仍然可以工作?

0 个答案:

没有答案