regole CSS condizionale con meno, sulla base di variabili

Question

la variabile può assumere valori percentuali o px, come:

@some-var: 50px; o @some-var: 46%;

Come posso definire un certo insieme di regole CSS se il valore è in pixel e un diverso insieme di regole se i valori sono in percentuale?

C'è qualcosa di simile

if(isValueInPixels(@some-var)){ 

    // css rules here 


}else{ 

    // other rules here 
} 

?

Answer 1

Penso che si possa usare qualcosa che chiamano Mixin protetti.

provare qualcosa di simile ...

.mixin (@a) when (ispixel(@a)) { 
/* ... your pixel specific logic ... */ 
} 
.mixin (@a) when (ispercentage(@a)) { 
/* ... your percentage specific logic ... */ 
} 

.coolStuff { 
.mixin(50px); 
.mixin(50%); 
} 

Vedi l'custodito Mixin a http://lesscss.org/

Answer 2

Come Adamo Spicer ha osservato il custodito Mixin sono la soluzione migliore. Tuttavia, MENO offre ora una soluzione per raggruppare più guardie, che consentirà di ottenere questo risultato con un singolo mix. http://lesscss.org/features/#css-guards-feature

Per esempio:

.mixin(@a){ 
    & when (ispixel(@a)){ 
    //logic 
    } 
    & when (ispercentage(@a)){ 
    //logic 
    } 
} 

Usage:

selector{ 
    .mixin(50px); 
    .mixin(46%); 
}