LESS - Fonction de longueur de liste

La description

Il prendra une liste de valeurs séparées par des virgules ou des espaces comme paramètre et retourne un entier représentant le nombre d'éléments dans une liste.

Exemple

L'exemple suivant illustre l'utilisation de la fonction de longueur dans le fichier LESS -

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

   <body>
      <h2>Example using Length Function</h2>
      <p>LESS enables customizable, manageable and reusable style sheet for web site.</p>
   </body>
</html>

Ensuite, créez le fichier style.less .

sans style

p {
   @list: "audi", "benz", "toyota","honda", "mahindra", "suzuki","volkswagen",
   "renault","bmw","tata","ford","skoda";
   @val: length(@list);
   font-size:@val;
}

Vous pouvez compiler le style.less en style.css en utilisant 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

p {
   font-size: 12;
}

Production

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

  • Enregistrez le code html ci-dessus dans le length.html fichier.

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