Variabel Mixin yang lebih sedikit dalam pemilih CSS

Apakah mungkin untuk menggabungkan nilai variabel less mixin dalam nama pemilih css?

ie:

.leftImage{
    .alignContent(left);
}

.alignContent(@side: left; @marAmount: 20px;){
    img{
        float: @side
        margin-@side: @marAmount;
    } 
}

Jadi yang saya coba lakukan adalah mencampurkan nilai @side (dalam hal ini) dengan sebagian pemilih css 'margin-' yang pada akhirnya mencoba membuat 'margin-'left'' (tanpa tanda kutip)


less
person user2870826    schedule 16.01.2014    source sumber

Jawaban (1)


arrow_upward
2
arrow_downward

Dalam LESS 1.6.x dan yang lebih tinggi, semudah:

.leftImage {
    .alignContent(left);
}

.alignContent(@side: left, @marAmount: 20px) {
    img {
        float: @side;
        margin-@{side}: @marAmount;
    } 
}

Namun hal yang sama juga dapat dilakukan pada versi sebelumnya, hanya perlu sedikit peretasan: Menggunakan variabel dalam nama properti di LESS (properti dinamis / interpolasi nama properti) dll.

person seven-phases-max    schedule 16.01.2014