El desbloqueo modificará el alcance del conjunto de reglas separado

Descripción

El conjunto de reglas separado puede obtener acceso al alcance si se importa en él.

Ejemplo

El siguiente ejemplo demuestra el desbloqueo. Esto modificará el alcance del conjunto de reglas separado en el archivo LESS -

pass_ruleset.htm

<!doctype html>
   <head>
      <link rel = "stylesheet" href = "style.css" type = "text/css" />
   </head>

   <body>
      <div class = "cont">
         <h2>Welcome to TutorialsPoint</h2>
         <p>The largest Tutorials Library on the web.</p>
      </div>
   </body>
</html>

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

estilo sin

#id {
   .style() {
      @detached: { font-style: @font; };
   }
}

.container() {
   @font: italic;
   #id > .style();
}

.cont {
   .container();
   @detached();
}

Puede compilar el archivo 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

.cont {
   font-style: italic;
}

Salida

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

  • Guarde el código html anterior en el passing_ruleset.htm archivo.

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