Membuat Kategori Flat UI Keren Untuk Css Desktop Mywapblog

Kategori Flat UI Keren Mywapblog

Tutorial membuat kategori blog flat ui keren untuk css mywapblog ini saya dapatkan dari seorang pembuat template blogspot dengan url blognya adalah http://fajriandaviar.blogspot.com.

Apakah bisa dipasang ke css mywapblog ? Jawabannya BISA. Memang ketika pertama saya coba edit hasilnya malah berantakan, namun setelah mencoba dan terus mencoba lagi akhirnya bisa juga membuat kategori flat ui yang keren.

Setiap hasil yang memuaskan pasti butuh latihan dan percobaan terus-menerus. Maka dari itu, hargailah setiap karya hasil kerja keras orang lain

Kali ini saya coba kreasikan dengan Css Desktop MyWapBlog tipe MOBILITY. Untuk tipe css lainnya tinggal ganti selektornya saja, karena setiap css desktop MWB berbeda-beda struktur HTMLnya yang menyebabkan berbeda pula selektor cssnya.

Pertama; Salin semua kode css yang ada dibawah ini :
#sidebar ul li:nth-child(3) ul{padding: 8px 0;margin: 0;list-style: none;}#sidebar ul li:nth-child(3) ul li{display: inline-block;float: left;font-size: 0;margin: 0 2px 2px 0;padding: 0 30px 0 5px;border-bottom: 0;background: #07ACEC;height: 30px;line-height: 30px;text-decoration: none;text-align: left;position: relative;transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-webkit-transition: all .3s ease-in-out;}#sidebar ul li:nth-child(3) ul li:after{content: "";position: absolute;width: 0px;height: 0px;border-width: 15px;border-style: solid;border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.3) rgba(0,0,0,0.2) transparent;}#sidebar ul li:nth-child(3) ul li:hover{color: #fff;background: #068ABD;}#sidebar ul li:nth-child(3) ul li a{color: #fff;font-size: 14px;}#sidebar ul li:nth-child(3) ul li a:hover{color: #fff;text-decoration: none;}

Kedua; Tempelkan kode css diatas dengan cara masuk ke MyWapBlog > Tema > DESKTOP > Aktifkan Tipe MOBILITY > Klik Sunting > Tempelkan pada bagian selektor #sidebar lalu klik simpan.

Langkah terakhir tinggal kunjungi blog anda. Jika belum berubah, silakan direload :)
Semoga dengan mengkreasikan kode css, mywapblog semakin berwarna dan tentunya semakin dikenal dunia. Ayo lanjutkan tradisi MyWapBlog.Com dengan terus berkreasi dengan css dan tulisan yang berkualitas.

Share this post