MENOS: espacios de nombres protegidos

Descripción

Cuando se aplica la protección al espacio de nombres, un mixin definido por el espacio de nombres se usa solo cuando la condición de protección devuelve verdadera. losnamespace guard es similar a guard on mixins.

Ejemplo

El siguiente ejemplo demuestra el uso de espacios de nombres protegidos en el archivo LESS:

<html>
   <head>
      <link rel = "stylesheet" href = "style.css" type = "text/css" />
      <title>Guarded Namespaces</title>
   </head>

   <body>
      <h2>Welcome to Tutorialspoint</h2>
      <p>This will paragraph be displayed red, when (@color = blue) in style.less 
      and when color is other than blue, then this paragraph will be default black.</p>
   </body>
</html>

A continuación, cree el archivo style.less .

estilo sin

@import "http://www.tutorialspoint.com/less/lib.less";
#namespace when (@color = blue) {
   .mixin() {
      color: red;
   }
}

p {
   #namespace .mixin();
}

El siguiente código importar el lib.less archivo en style.less del camino camino -

lib.less

@color: blue;

Puede compilar style.less en style.css usando el siguiente comando:

lessc style.less style.css

Ejecute el comando anterior; creará el archivo style.css automáticamente con el siguiente código:

style.css

p {
   color: red;
}

Salida

Siga estos pasos para ver cómo funciona el código anterior:

  • Guarde el código html anterior en el less_mixin_guarded_namespaces.html archivo.

  • Abra este archivo HTML en un navegador, se mostrará el siguiente resultado.