[caption id="" align="aligncenter" width="610" caption="Metro Style UI CSS 2.0"][/caption] Salah satu gaya desain web yang sedang ngetrend di tahun ini adalah metro UI design atau gaya desain metro. Gaya desain Metro UI ini muncul seiring dengan berkembangnya pengguna win8. Sergey Pimenov, telah membuat tools CSS yang bisa mempermudah sobat yang berminat membuat desain web bergaya metro style. Beliau menamakan tools ini Metro UI CSS, yang saat Tulisan ini dibuat, baru masuk ke versi 2.0. Pembuatan Desain web bergaya metro Style yang ditawarkan oleh tools ini cukup dengan 5 langkah mudah:
- Buat page dengan HTML5 DOCTYPE
- Include metro-bootstrap.css di antara tag HEAD
- Include metro.min.js (jquery.js required) di antara tag HEAD
- Buat content dengan menggunakan Class .metro
- Gunakan Markup sesuai petunjuk yang ada di situs http://metroui.org.ua/
Dukungan Icon
Metro Style UI CSS 2.0 sudah mendukung iconic font.banyak diantara icon dari metro style UI yang tidak tersedia di font awesome seperti icon database, dll.
Component yang didukung
Title Component
bentuk dari Title component yang bisa dihasilkan dari metro Style UI 2.0 diantaranya adalah sebagai berikut : Untuk menghasilkan Title dengan tampilan seperti itu, dengan menggunakan kode berikut:
Baca konten-konten menarik Kompasiana langsung dari smartphone kamu. Follow channel WhatsApp Kompasiana sekarang di sini: https://whatsapp.com/channel/0029VaYjYaL4Spk7WflFYJ2H