Menggunakan Variable pada CSS

Hallo teman-teman, pada kesempatan kali ini saya akan memberikan satu trik tentang css3 yang sangat berguna untuk kedepannya. Sebagai web desainer atau developer pastinya kalian tidak asing dengan CSS kan? Dalam setiap bahasa program biasanya terdapat variable untuk menampung value tertentu agar bisa digunakan berulang-ulang. Namun tahukah kalian bahwa ternyata CSS juga memiliki fitur variable.

Cara menggunakan variable pada css juga cukup mudah, kita hanya perlu mendevinisikan variable seperti berikut

selanjutnya kita cukup terapkan pada css seperti berikut, dimana variable yang ada pada selector :root diletakan pada value css dengan menggunakan fungsi var() dan -webkit-var() untuk alternative jika tidak berjalan pada browser Google Chrome

Sekarang kita buat dua buah tag html untuk penerapan css tersebut

jika dilihat pada browser akan menjadi seperti ini

Baiklah teman-teman, demikian artikel kali ini yang membahas tentang penggunaan variable pada css, semoga bermanfaat. terima kasih