Question

所以我有一点Less

#footer {
    ul {
        // stuff
    }
    li {
        // stuff
    }
}

一切都很好地包含在#footer中，但是我想说#footer的前缀。我如何使用类似.ie6或.ie7的类添加页脚，但是在#footer的“封闭”内呢？

例如，我想这样做（观察伪语法＆gt; .ie6，＆gt; .ie7）：

#footer {
    <.ie6, <.ie7 {
        // ie6/7 stuff
    }
    ul {
        // stuff
    }
    li {
        // stuff
    }
}

让它产生这个：

.ie6 #footer,
.ie7 #footer {}

#footer {}
#footer ul {}
#footer li {}

任何想法如何用Less来实现这个目标？

Answer 1

我不相信可以在#footer之前放置课程，除非您将所有内容都包裹在.ie6/7而不是#footer

LESS网站显示以下示例：

#header        { color: black;
  .navigation  { font-size: 12px }
  .logo        { width: 300px;
    &:hover    { text-decoration: none }
  }
}

我认为这是达到你想要的唯一方式，所以：

    #footer {
    .ie6{
        // ie6 stuff
    }
    .ie7{
       //ie7 stuff
    }
    ul {
        // stuff
    }
    li {
        // stuff
    }
    }

会在ID后面的类中生成，我似乎无法找到一种方法来实现你想要的东西而不会将所有内容嵌套在.ie6/7

中

Answer 2

我认为您可能对此感兴趣：https://github.com/cloudhead/less.js/pull/268#issuecomment-1207479

你想要做的事情还不可能在主人的less.js.但是一个人，詹姆斯福斯特，分叉它并添加了这个功能。

示例：

#box {
    #other-box {
        margin: 10px 0 0;

        .ie7 & {
            margin: 5px 0 0;
        }
    }
}

较少嵌套的命名空间？

2 个答案: