Mengenal CSS LESS.

Mengenal CSS LESS. Sebelum saya menjelaskan apa itu less, atau apa yang dimaksud dengan css less, saya ingin menjelaskan kepada teman-teman bahwasanya disini tidak ada niat saya untuk menggurui Anda, melainkan saya hanya ingin berbagi pengetahuan yang saya dapatkan dari berbagai situs yang telah saya kunjungi sebagai referensi saya dalam membuat artikel ini, artikel ini membahas tentang bagian-bagian yang terdapat pada css, seperti sebelumnya saya juga sudah menjelaskan beberapa bagian yang terdapat pada css yang mana artikel sebelumnya adalah Mengennal pseudo element dan Mengenal pseudo class, jika tertarik untuk mengetahuinya silahkan kunjungi.


LESS merupakan ekstensi dari CSS, yang menambahkan perilaku dinamis seperti variabel, mixin, operasi, & fungsi. LESS dapat dijalankan pada sisi klien (Chrome, Safari, Firefox) maupun server (menggunakan Node.js dan Rhino). LESS adalah sebuah preprocessor atau secara gampangnya LESS merupakan sebuah bahasa penulisan stylesheet dinamis. Fungsinya seperti Cascading Style Sheets (CSS) yaitu digunakan untuk mengatur tampilan halaman website secara dinamis, mengatur blok blok dan frame tanpa menggunakan table atau sering juga disebut dengan sistem Tableless. LESS berbasis open source, jadi kita bebas menggunakan dan mengembangkannya sesuai dengan kebutuhan kita. LESS ini memudahkan kita dalam membuat file CSS, karena syntak LESS dapat di compile menjadi file CSS.

LESS memiliki beberapa fitur yang mampu membawa pemrograman tampilan website menggunakan CSS menuju ke skala yang lebih dinamis. Berikut ini adalah fitur-fitur utama yang dimiliki oleh LESS.

1. Variabel. Dengan menggunakan variabel pada LESS kita dapat mendeklarasikan nilai-nilai yang akan digunakan secara luas atau sering digunakan dalam satu tempat saja. Nilai-nilai tersebut nantinya dapat kita gunakan berulang-ulang dalam stylesheet dengan mudah. Dengan demikian, untuk membuat perubahan kode secara global menjadi lebih mudah, sesederhana mengubah satu baris kode.

2. Mixin memungkinkan kita untuk memasukkan semua properti dari sebuah kelas ke dalam kelas lain cukup dengan menyertakan nama kelas tersebut sebagai properti kelas tujuan. Pada dasarnya mixin hampir sama dengan variable, tapi mixin mencakup seluruh kelas. Mungkin mixin ini pada bahasa pemrograman lain bisa Anda setarakan dengan fungsi atau modul, Anda juga dapat menyertakan parameter atau argument di dalamnya.

3. Nested Rule. LESS juga mendukung nested rule atau aturan bertingkat yang memungkinkan Anda untuk mendefinisikan elemen turunan dengan spesifik tanpa perlu menuliskan nama selector dari elemen tersebut dengan baris yang panjang. Anda cukup mendefinisikan elemen tersebut di dalam elemen induknya. Dengan demikian turunan elemen dapat diketahui dengan mudah dan membuat kode pada stylesheet lebih ringkas.

4. Functions & Operations. Pengembang LESS juga menyertakan operasi matematika yang memungkinkan Anda untuk menjumlahkan, mengurangi, membagi maupun mengalikan warna atau nilai lainnya pada properti sebuah elemen. Fitur ini mendukung terjadinya keterkaitan yang lebih kompleks antar properti dari elemen tampilan sehingga perubahan secara masif bisa dilakukan dengan mudah. Karena fungsi-fungsi dan operasi tersebut diproses satu persatu menggunakan javascript, Anda memungkinkan untuk mengatur nilai-nilai properti sedemikian rupa sesuai kehendak.

Demikian saja sekilas perkenalan dengan CSS LESS yang dapat saya sampaikan pada kesempatan kali ini, mungkin dalam penulisan dan penyampaian saya masih sangat banyak terdapat kekurangan kerena saya masih dalam tahap belajar, mungkin pada kesempatan selanjutnya saya akan mengekplorasikannya agar lebih lengkap lagi untuk mempelajari CSS, akhir kata semoga bermanfaat dan terimakasih atas kunjungannya.

Sumber referensi :
http://www.nurulimam.com/2013/10/belajar-mengenal-less-css-preprocessor.html
http://bisakomputer.com/mengenal-less-framework-untuk-css/

Share this:

 
Copyright © Babble of Ibnoec. Designed by OddThemes