KURANG - Operasi

Deskripsi

LESS memberikan dukungan untuk beberapa operasi aritmatika seperti plus (+), minus (-), perkalian (*) dan pembagian (/) dan mereka dapat beroperasi pada bilangan, warna atau variabel apapun. Operasi menghemat banyak waktu saat Anda menggunakan variabel dan Anda ingin mengerjakan matematika sederhana.

Contoh

Contoh berikut menunjukkan penggunaan operasi di file LESS -

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

Selanjutnya, buat file style.less .

style.less

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

Anda dapat mengompilasi file style.less ke style.css dengan menggunakan perintah berikut -

lessc style.less style.css

Jalankan perintah di atas; itu akan membuat file style.css secara otomatis dengan kode berikut -

style.css

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

Keluaran

Ikuti langkah-langkah ini untuk melihat cara kerja kode di atas -

Simpan kode html di atas di file operations.html mengajukan.
Buka file HTML ini di browser, output berikut akan ditampilkan.