CSS3 Background Gradient

Sekarang lagi trend nih tentang css3 jadi jangan sampai ketinggalan ntar di bilang gak gaul sama blogger lain. Nah biar Sobat semua g ketinggalan berita tentang css3, Tongkrongin terus oketrik, biar g di bilang katro tentang css3 atau perkembangan web lainnya. Mungkin CSS3 tidak dapat di lihat oleh semua browser namun browser-browser yang tidak dapat melihatnya rata-rata browser yang jarang dipakai orang jadi jangan khawatir kalau efek css3 tidak bisa dilihat.

Untuk Trik CSS3 kali ini saya akan menjelaskan tentang background gradient. Biasanya background gradient dibuat dengan image namun dengan css3 hanya dengan kode saja jadi image/Gambar ke laut aja . Dengan css3 blog kita akan semakin atraktif dan unik namun masih tetap cepat loading blog sobat (baca : Cek kecepatan Blog atau Speed test). Sekarang lihat nih background di bawah ini :

kode yang di pakai

background: -moz-linear-gradient(top, #ff0000, #FFCCCC);
background: -webkit-gradient(linear, left top, left bottom, from(#ff0000), to(#FFCCCC));

Coba sobat klik pasti g bisakan? soalnya itu bukan gambar tapi kode saja, disana terdapat 2 kode warna yang dipakai dan kode yang pertama di atas lalu kode yang kedua di bawah. oiya satu contoh lagi nih:

kode yang di pakai

background: -moz-linear-gradient(top, #ff0000, #ffffff);
background: -webkit-gradient(linear, left top, left bottom, from(#FF0000), to(#ffffff));

Nah kalau yang ini memakai 3 kode warna yaitu biru, putih dan hitam. Bagaimana pendapat sobat tentang Css3 Background Gradient? keren bukan efek yang di timbulkan css3 ? oke saya pamit dulu y. Terima kasih dan Happy Blogging .

Lihat Juga Efek Css3 lainnya :

• Membuat Text Shadows (tulisan bayangan)
• Drop Shadows
• Mengenal Text Column
• Border Lengkung

Bagikan Artikel : Facebook Twitter Google+ Linkedin Technorati Digg