Concatenar cadenas en Menos

Creo que esto no es posible, pero pensé preguntar en caso de que haya una manera. La idea es que tengo una variable para path to web resource folder: 

@root: "../img/";
@file: "test.css";
@url: @root@file;

.px {
    background-image: url(@url);
}

Obtengo esto como resultado:

.px { background-image: url("../img/" "test.css"); }

Pero, quiero que las cadenas se combinen en una cadena como esta: 

.px { background-image: url("../img/test.css"); }

¿Es posible concatenar cadenas juntas en Less?

Author: Volker E., 2012-04-21
Source

6 answers

Use Interpolación variable : 

@url: "@{root}@{file}";

Código completo: 

@root: "../img/";
@file: "test.css";

@url: "@{root}@{file}";

.px{ background-image: url(@url); }
 205
Author: Paulpro,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-06-11 15:44:31

Como puede ver en la documentación , puede usar interpolación de cadenas también con cadenas variables y simples juntas: 

@base-url: "http://assets.fnord.com";
background-image: url("@{base-url}/images/bg.png");
 29
Author: Stephan Hoyer,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-03-04 07:37:19

Estaba buscando el mismo truco para manejar imágenes. Usé un mixin para responder esto: 

.bg-img(@img-name,@color:"black"){
    @base-path:~"./images/@{color}/";
    background-image: url("@{base-path}@{img-name}");
}

Entonces puedes usar: 

.px{
    .bg-img("dot.png");
}

O 

.px{
    .bg-img("dot.png","red");
}
 11
Author: user2725509,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-08-28 13:20:35

No sé si estás usando menos.js o lessphp (como en WP-Less plugin para WordPress) pero con lessphp puede" unquote " cadenas con ~ : http://leafo.net/lessphp/docs/#string_unquoting

 7
Author: FelipeAls,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2012-04-21 05:19:27

Para esos valores unitarios similares a cadenas como 45deg en transform: rotate(45deg) use la función unit(value, suffix). Ejemplo: 

// Mixin
.rotate(@deg) {
  @rotation: unit(@deg, deg);
  -ms-transform: rotate(@rotation);
  transform: rotate(@rotation);
}

// Usage
.rotate(45);

// Output
-ms-transform: rotate(45deg);
transform: rotate(45deg);
 5
Author: jordanb,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-11-19 17:38:43

Usando Drupal 7. He usado una marca de plus ordinaria y está funcionando: 

@images_path+'bg.png'
 -7
Author: Gaba,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-02-14 12:47:56