MOINS - Passer des ensembles de règles aux mixins

La description

L'ensemble de règles détaché contient des ensembles de règles tels que des propriétés, des ensembles de règles imbriqués, une déclaration de variables, des mixins, etc. Il est stocké dans une variable et inclus dans une autre structure; toutes les propriétés du jeu de règles sont copiées dans cette structure.

Exemple

L'exemple suivant montre comment transmettre un ensemble de règles à mixin dans le fichier LESS -

passant_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>

Ensuite, créez le fichier style.less .

sans style

@detached-ruleset: {
   .mixin() {
      font-family: "Comic Sans MS";
      background-color: #AA86EE;
   }
};

.cont {
   @detached-ruleset();
   .mixin();
}

Vous pouvez compiler le fichier style.less dans style.css à l'aide de la commande suivante -

lessc style.less style.css

Exécutez la commande ci-dessus; il créera automatiquement le fichier style.css avec le code suivant -

style.css

.cont {
   font-family: "Comic Sans MS";
   background-color: #AA86EE;
}

Production

Suivez ces étapes pour voir comment fonctionne le code ci-dessus -

  • Enregistrez le code html ci-dessus dans le passing_ruleset.htm fichier.

  • Ouvrez ce fichier HTML dans un navigateur, la sortie suivante s'affichera.

Cadrage

Toutes les variables et mixins de l'ensemble de règles détaché sont disponibles partout où l'ensemble de règles est appelé ou défini. Sinon, l'appelant et les étendues de définition sont disponibles par défaut. La portée de la déclaration a la priorité lorsque les deux portées contiennent le même mixin ou variable. Le corps de l'ensemble de règles détaché est défini dans la portée de la déclaration. Il ne change pas sa portée une fois que l'ensemble de règles détaché a été copié d'une variable à une autre.

Le tableau suivant répertorie tous les types de portée -

Sr.No. Types et description
1 Définition et visibilité de l'étendue de l'appelant

Les variables et les mixins sont définis à l'intérieur du jeu de règles détaché.
2 Le référencement ne modifie pas la portée de l'ensemble de règles détaché

En donnant simplement les références, le jeu de règles n'accède à aucune nouvelle portée.
3 Le déverrouillage modifiera la portée de l'ensemble de règles détaché

L'ensemble de règles détaché peut accéder à l'étendue en y étant importé.