WENIGER - Operationen

Beschreibung

WENIGER unterstützt einige arithmetische Operationen wie Plus (+), Minus (-), Multiplikation (*) und Division (/) und kann mit einer beliebigen Zahl, Farbe oder Variablen arbeiten. Operationen sparen viel Zeit, wenn Sie Variablen verwenden und an einfacher Mathematik arbeiten möchten.

Beispiel

Das folgende Beispiel zeigt die Verwendung von Operationen in der LESS-Datei -

<html>
   <head>
      <title>Less Operations</title>
      <link rel = "stylesheet" type = "text/css" href = "style.css" />
   </head>
   
   <body>
      <h1>Example using Operations</h1>
      <p class = "myclass">LESS enables customizable, 
      manageable and reusable style sheet for web site.</p>
   </body>
</html>

Erstellen Sie als Nächstes die Datei style.less .

style.less

@fontSize: 10px;
.myclass {
   font-size: @fontSize * 2;
   color:green;
}

Sie können die Datei style.less mit dem folgenden Befehl in style.css kompilieren :

lessc style.less style.css

Führen Sie den obigen Befehl aus. es wird die erstellen style.css Datei automatisch mit dem folgenden Code -

style.css

.myclass {
   font-size: 20px;
   color: green;
}

Ausgabe

Befolgen Sie diese Schritte, um zu sehen, wie der obige Code funktioniert -

Speichern Sie den obigen HTML-Code in der operations.html Datei.
Öffnen Sie diese HTML-Datei in einem Browser. Die folgende Ausgabe wird angezeigt.