1

私は現在、このコードを持っています:

input[type=text] {
    background:transparent top center no-repeat;
    height:30px;
    font-size:13px;
    color:@greyBlue;
    padding:0 10px;
    border:none;
    &.long {
        background-image:url("/img/input_long.png");
        width:214px;
    }
    &.medium {
        background-image:url("/img/input_medium.png");
        width:96px;
    }
    &.short {
        background-image:url("/img/input_short.png");
        width:55px;
    }
}

ファイル名の部分を変数で変更するだけで簡単にできるかどうか知っていますか? このようなもの ：

input[type=text] {
    @input = "";
    background-image:url("/img/input_@{input}.png");

    &.long {
        @input = "long";
    }
}

もちろんこれがうまくいかない場合でも、機能的な方法について何かアイデアがあれば...どうもありがとう！

4

1 に答える 1

1

ミックスインを作成する

.bgImg(@input) {
     background-image:url("/img/input_@{input}.png");
}

それに応じて呼び出します：

&.long {
    .bgImg("long");
}
于 2012-08-02T09:52:04.750 に答える