web-dev-qa-db-ja.com

n番目の子のミックスインが少ないですか？

私はこの出力を与えるLESSミックスインを作ろうとしています：

.resource:nth-child(8n+1) { clear: left; }

私はこれまでにこれを持っています：

.wrap-every(@n) {
    &:nth-child(@n + "n+1") {  // parse error on this line
        clear: left;
    }
}

.resource {
    .wrap-every(8);
}

しかし、それは示された行に解析エラーを与えています

ParseError：認識されない入力

これを行う方法はありますか？

csslessmixins
15
recursive

少ない> = 1.4

あなたはこのようなことをすることができます：

.wrap-every(@n) {
  &:nth-child(@{n}n + 1) {
        clear: left;
    }
}

これにより、目的の出力が得られるはずです。ハックは必要ありません。

レスの古いバージョンで

簡単に試すことができます文字列補間：

.wrap-every(@n) {
    @t: ~":nth-child(@{n}n + 1)";
    &@{t} {
        clear: left;
    }
}

そして、出力[〜＃〜] css [〜＃〜]どちらの場合も、次のようになります。

.resource:nth-child(8n + 1) {
  clear: left;
}
25
Martin Turjak