13

less を使用して、クラス内の特定の要素をターゲットにしたいと考えています。

この場合、 class の要素をターゲットにしbuttonたいのですが、その中でアンカータグをターゲットにしたいと思いaます。

現在私は持っています:

.button {
    /* lots of bits and pieces go here, hence 
    the need to keep it at a class level
    */


    /* further down, but still in .button */
    /* Attempt 1 - fails: compiled = a .button (note the space)
    a& {
         height:20px;
    }

    /* Attempt 2 - fails: compiled = .buttona
    &a {
        height:20px;
    }
}

私は基本的にそれを次のようにコンパイルしたい:

a.button

これは、次のような要素を作成できるようにするためです。

<a class="button">
<button class="button">

ただし、アンカーの場合は少し変更します。it's a bug in less!あまりにも早くカードを投入したくありませんが、使用&.another-classすると期待どおりに動作します (コンパイル済み:.button.another-classですが、要素をターゲットにする場合はそうではありません

4

2 に答える 2

17

less の古いバージョンを使用しています。以下のコードは、less 1.3.3 を使用して正しい CSS を生成します。

.button {
 a& {
    height:20px;
  }
}

生成:

a.button {
  height: 20px;
}
于 2013-01-05T09:34:04.070 に答える